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

   1 <div
   2   id="openchannel-openchannelAccount"
   3   class="page-layout simple tabbed"
   4   layout="column"
   5 >
   6   <!-- HEADER -->
   7   <div class="header md-accent-bg" layout="row" layout-align="start center">
   8     <div class="white-fg" layout="row" layout-align="start center" flex>
   9       <md-button
  10         class="goto-openchannelAccounts-button md-icon-button"
  11         aria-label="Go to openchannelAccounts"
  12         ng-click="vm.gotoOpenchannelAccounts()"
  13         translate
  14         translate-attr-aria-label="OPENCHANNEL.GO_TO_OPENCHANNELACCOUNTS"
  15       >
  16         <md-icon md-font-icon="icon-arrow-left"></md-icon>
  17       </md-button>
  18
  19       <div layout="row" layout-align="start center">
  20         <div class="openchannelAccount-image" hide-xs>
  21           <img ng-src="assets/images/business/openchannelAccounts.jpg" />
  22         </div>
  23
  24         <div layout="column" layout-align="start start">
  25           <div class="h2">
  26             #{{vm.openchannelAccount.id}}
  27             <span ng-if="vm.openchannelAccount.name"
  28               >{{vm.openchannelAccount.name}}</span
  29             >
  30           </div>
  31           <div class="subtitle secondary-text">
  32             <span translate="OPENCHANNEL.CREATED_AT"></span>
  33             <span>{{vm.openchannelAccount.createdAt | date:'medium'}}</span>
  34           </div>
  35         </div>
  36       </div>
  37     </div>
  38
  39     <div ng-cloak>
  40       <md-button
  41         ng-click="vm.agentadddialog(vm.openchannelAccount, $event)"
  42         class="md-fab md-warn md-icon-button"
  43         aria-label="agentadd"
  44       >
  45         <md-tooltip
  46           ><span translate="OPENCHANNEL.AGENTADD_OPENCHANNELACCOUNT"></span
  47         ></md-tooltip>
  48         <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
  49       </md-button>
  50     </div>
  51     <div>
  52       <md-button
  53         type="submit"
  54         ng-click="vm.saveOpenchannelAccount()"
  55         ng-if="vm.crudPermissions.canEdit"
  56         class="send-button md-accent md-raised"
  57         ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (proxyForm.$invalid) || (dispositionForm.$invalid) || (openchannelDispositionsForm.$invalid) || (openchannelCannedAnswersForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
  58         translate="OPENCHANNEL.SAVE"
  59         translate-attr-aria-label="OPENCHANNEL.SAVE"
  60       >
  61         SAVE
  62       </md-button>
  63     </div>
  64   </div>
  65   <!-- / HEADER -->
  66
  67   <!-- CONTENT -->
  68   <div class="content">
  69     <md-tabs
  70       md-selected="vm.selectedTab"
  71       md-stretch-tabs="always"
  72       flex
  73       layout-fill
  74       md-dynamic-height
  75     >
  76       <md-tab>
  77         <md-tab-label>
  78           <span translate="OPENCHANNEL.SETTINGS">SETTINGS</span>
  79         </md-tab-label>
  80         <md-tab-body>
  81           <div
  82             class="openchannelAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
  83           >
  84             <div class="pb-16" layout="row" layout-align="start center">
  85               <div class="h2 secondary-text" translate="OPENCHANNEL.GENERAL">
  86                 GENERAL
  87               </div>
  88             </div>
  89             <form name="generalForm" novalidate>
  90               <md-input-container class="md-block">
  91                 <label translate="OPENCHANNEL.NAME">Name</label>
  92                 <input
  93                   type="text"
  94                   name="name"
  95                   ng-model="vm.openchannelAccount.name"
  96                   ng-required="true"
  97                   autofocus
  98                   disabled
  99                 />
 100
 101                 <div
 102                   ng-messages="generalForm['name'].$error"
 103                   ng-show="generalForm['name'].$touched"
 104                   role="alert"
 105                 >
 106                   <div ng-message="required">
 107                     <span translate="OPENCHANNEL.ERRORS.NAME_REQUIRED"
 108                       >Name field is required</span
 109                     >
 110                   </div>
 111                 </div>
 112               </md-input-container>
 113               <md-input-container class="md-block">
 114                 <label translate="OPENCHANNEL.KEY">key</label>
 115                 <input
 116                   type="text"
 117                   name="key"
 118                   ng-model="vm.openchannelAccount.key"
 119                   md-maxlength="5"
 120                   ng-required="true"
 121                   ng-disabled="!vm.crudPermissions.canEdit"
 122                 />
 123
 124                 <div
 125                   ng-messages="generalForm['key'].$error"
 126                   ng-show="generalForm['key'].$touched"
 127                   role="alert"
 128                 >
 129                   <div ng-message="required">
 130                     <span translate="OPENCHANNEL.ERRORS.KEY_REQUIRED"
 131                       >key field is required</span
 132                     >
 133                   </div>
 134                   <div ng-message="md-maxlength">
 135                     <span
 136                       translate="OPENCHANNEL.ERRORS.KEY_MAX_LENGTH"
 137                       translate-values="{max: 5}"
 138                       >key must have a maximum length equal to 5</span
 139                     >
 140                   </div>
 141                 </div>
 142               </md-input-container>
 143               <md-input-container class="md-block">
 144                 <label translate="OPENCHANNEL.REPLYURI">replyUri</label>
 145                 <input
 146                   type="url"
 147                   name="replyUri"
 148                   ng-model="vm.openchannelAccount.replyUri"
 149                   ng-disabled="!vm.crudPermissions.canEdit"
 150                 />
 151
 152                 <div class="hint">
 153                   <span translate="OPENCHANNEL.HELP.REPLYURI"></span>
 154                 </div>
 155                 <div
 156                   ng-messages="generalForm['replyUri'].$error"
 157                   ng-show="generalForm['replyUri'].$touched"
 158                   role="alert"
 159                 >
 160                   <div ng-message="required">
 161                     <span translate="OPENCHANNEL.ERRORS.REPLYURI_REQUIRED"
 162                       >replyUri field is required</span
 163                     >
 164                   </div>
 165                   <div ng-message="url">
 166                     <span translate="OPENCHANNEL.ERRORS.REPLYURI_MUST_VALID_URL"
 167                       >replyUri must be a valid url http://www.xcally.com</span
 168                     >
 169                   </div>
 170                 </div>
 171               </md-input-container>
 172               <md-input-container class="md-block">
 173                 <label translate="OPENCHANNEL.LIST">List</label>
 174                 <md-select
 175                   name="ListId"
 176                   ng-model="vm.openchannelAccount.ListId"
 177                   required
 178                   ng-disabled="!vm.crudPermissions.canEdit"
 179                 >
 180                   <md-option
 181                     ng-value="ListId.id"
 182                     ng-repeat="ListId in vm.lists"
 183                     ng-disabled="ListId.canSelect === false"
 184                     >{{ ListId.name }}</md-option
 185                   >
 186                 </md-select>
 187                 <div class="hint">
 188                   <span translate="OPENCHANNEL.HELP.LIST"></span>
 189                 </div>
 190                 <div
 191                   ng-messages="generalForm['ListId'].$error"
 192                   ng-show="generalForm['ListId'].$touched"
 193                   role="alert"
 194                 >
 195                   <div ng-message="required">
 196                     <span translate="OPENCHANNEL.ERRORS.LIST_REQUIRED"
 197                       >List field is required</span
 198                     >
 199                   </div>
 200                 </div>
 201               </md-input-container>
 202               <md-input-container class="md-block">
 203                 <label translate="OPENCHANNEL.WAITFORTHEASSIGNEDAGENT"
 204                   >WaitForTheAssignedAgent</label
 205                 >
 206                 <input
 207                   type="number"
 208                   name="waitForTheAssignedAgent"
 209                   ng-model="vm.openchannelAccount.waitForTheAssignedAgent"
 210                   min="1"
 211                   max="2147483"
 212                   ng-required="true"
 213                   ng-disabled="!vm.crudPermissions.canEdit"
 214                 />
 215
 216                 <div
 217                   ng-messages="generalForm['waitForTheAssignedAgent'].$error"
 218                   ng-show="generalForm['waitForTheAssignedAgent'].$touched"
 219                   role="alert"
 220                 >
 221                   <div ng-message="required">
 222                     <span
 223                       translate="OPENCHANNEL.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
 224                       >WaitForTheAssignedAgent field is required</span
 225                     >
 226                   </div>
 227                   <div ng-message="min">
 228                     <span
 229                       translate="OPENCHANNEL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
 230                       >WaitForTheAssignedAgent must be a valid greater or equal
 231                       than</span
 232                     >
 233                     <span>1</span>
 234                   </div>
 235                   <div ng-message="max">
 236                     <span
 237                       translate="OPENCHANNEL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
 238                       >WaitForTheAssignedAgent must be a valid greater or equal
 239                       than</span
 240                     >
 241                     <span>2147483</span>
 242                   </div>
 243                 </div>
 244               </md-input-container>
 245               <md-input-container class="md-block">
 246                 <label translate="OPENCHANNEL.MAPKEY">MapKey</label>
 247                 <md-select
 248                   name="mapKey"
 249                   ng-model="vm.openchannelAccount.mapKey"
 250                   ng-disabled="!vm.crudPermissions.canEdit"
 251                 >
 252                   <md-option ng-value="''">None</md-option>
 253                   <md-optgroup label="standard">
 254                     <md-option
 255                       ng-value="mapKey.columnName"
 256                       ng-repeat="mapKey in vm.fields"
 257                       ng-if="!mapKey.columnName.toString().startsWith('cf_')"
 258                       ng-disabled="mapKey.canSelect === false"
 259                       >{{ mapKey.displayName }}</md-option
 260                     >
 261                   </md-optgroup>
 262                   <md-optgroup label="custom">
 263                     <md-option
 264                       ng-value="mapKey.columnName"
 265                       ng-repeat="mapKey in vm.fields"
 266                       ng-if="mapKey.columnName.toString().startsWith('cf_')"
 267                       ng-disabled="mapKey.canSelect === false"
 268                       >{{ mapKey.displayName }}</md-option
 269                     >
 270                   </md-optgroup>
 271                 </md-select>
 272                 <div
 273                   ng-messages="generalForm['mapKey'].$error"
 274                   ng-show="generalForm['mapKey'].$touched"
 275                   role="alert"
 276                 >
 277                   <div ng-message="required">
 278                     <span translate="OPENCHANNEL.ERRORS.MAPKEY_REQUIRED"
 279                       >MapKey field is required</span
 280                     >
 281                   </div>
 282                 </div>
 283               </md-input-container>
 284               <md-input-container class="md-block">
 285                 <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
 286                 <input
 287                   type="text"
 288                   name="description"
 289                   ng-model="vm.openchannelAccount.description"
 290                   ng-disabled="!vm.crudPermissions.canEdit"
 291                 />
 292
 293                 <div
 294                   ng-messages="generalForm['description'].$error"
 295                   ng-show="generalForm['description'].$touched"
 296                   role="alert"
 297                 >
 298                   <div ng-message="required">
 299                     <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
 300                       >Description field is required</span
 301                     >
 302                   </div>
 303                 </div>
 304               </md-input-container>
 305               <md-input-container class="md-block">
 306                 <label translate="OPENCHANNEL.RECEIVEURI">receiveUri</label>
 307                 <div layout="row" layout-align="center center">
 308                   <button
 309                     class="md-button md-fab md-mini md-primary"
 310                     ngclipboard
 311                     data-clipboard-target="#copytoclipboard-receiveUri"
 312                     ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
 313                     ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
 314                   >
 315                     <md-icon md-font-icon="icon-clipboard-text"></md-icon>
 316                   </button>
 317                   <input
 318                     class="md-input"
 319                     type="text"
 320                     id="copytoclipboard-receiveUri"
 321                     name="receiveUri"
 322                     ng-value="vm.location + '/api/openchannel/accounts/' + vm.openchannelAccount.id + '/notify'"
 323                     ng-readonly="true"
 324                   />
 325                 </div>
 326                 <div class="hint">
 327                   <span translate="OPENCHANNEL.HELP.RECEIVEURI"></span>
 328                 </div>
 329               </md-input-container>
 330             </form>
 331           </div>
 332           <div
 333             class="openchannelAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
 334           >
 335             <div class="pb-16" layout="row" layout-align="start center">
 336               <div
 337                 class="h2 secondary-text"
 338                 translate="OPENCHANNEL.NOTIFICATION"
 339               >
 340                 NOTIFICATION
 341               </div>
 342             </div>
 343             <form name="notificationForm" novalidate>
 344               <md-input-container class="md-block">
 345                 <md-switch
 346                   ng-model="vm.openchannelAccount.notificationSound"
 347                   aria-label="notificationSound"
 348                   ng-disabled="!vm.crudPermissions.canEdit"
 349                   ><span translate="OPENCHANNEL.NOTIFICATIONSOUND"
 350                     >notificationSound</span
 351                   ></md-switch
 352                 >
 353               </md-input-container>
 354               <md-input-container class="md-block">
 355                 <md-switch
 356                   ng-model="vm.openchannelAccount.notificationShake"
 357                   aria-label="notificationShake"
 358                   ng-disabled="!vm.crudPermissions.canEdit"
 359                   ><span translate="OPENCHANNEL.NOTIFICATIONSHAKE"
 360                     >notificationShake</span
 361                   ></md-switch
 362                 >
 363               </md-input-container>
 364               <div class="md-block">
 365                 <label
 366                   class="md-caption grey-fg"
 367                   translate="OPENCHANNEL.NOTIFICATIONTEMPLATE"
 368                   >notificationTemplate</label
 369                 >
 370                 <textarea
 371                   aria-label="notificationTemplate notificationTemplate"
 372                   ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
 373                   ng-model="vm.openchannelAccount.notificationTemplate"
 374                 ></textarea>
 375               </div>
 376             </form>
 377           </div>
 378           <div
 379             class="openchannelAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
 380           >
 381             <div class="pb-16" layout="row" layout-align="start center">
 382               <div class="h2 secondary-text" translate="OPENCHANNEL.TRANSFER">
 383                 TRANSFER
 384               </div>
 385             </div>
 386             <form name="transferForm" novalidate>
 387               <md-input-container class="md-block">
 388                 <md-switch
 389                   ng-model="vm.openchannelAccount.queueTransfer"
 390                   aria-label="queueTransfer"
 391                   ng-disabled="!vm.crudPermissions.canEdit"
 392                   ><span translate="OPENCHANNEL.QUEUETRANSFER"
 393                     >queueTransfer</span
 394                   ></md-switch
 395                 >
 396               </md-input-container>
 397               <md-input-container
 398                 ng-if="vm.openchannelAccount.queueTransfer == true"
 399                 class="md-block"
 400               >
 401                 <label translate="OPENCHANNEL.QUEUETRANSFERTIMEOUT"
 402                   >queueTransferTimeout</label
 403                 >
 404                 <input
 405                   type="number"
 406                   name="queueTransferTimeout"
 407                   ng-model="vm.openchannelAccount.queueTransferTimeout"
 408                   min="1"
 409                   max="2147483"
 410                   ng-required="true"
 411                   ng-disabled="!vm.crudPermissions.canEdit"
 412                 />
 413
 414                 <div
 415                   ng-messages="transferForm['queueTransferTimeout'].$error"
 416                   ng-show="transferForm['queueTransferTimeout'].$touched"
 417                   role="alert"
 418                 >
 419                   <div ng-message="required">
 420                     <span
 421                       translate="OPENCHANNEL.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
 422                       >queueTransferTimeout field is required</span
 423                     >
 424                   </div>
 425                   <div ng-message="min">
 426                     <span
 427                       translate="OPENCHANNEL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
 428                       >queueTransferTimeout must be a valid greater or equal
 429                       than</span
 430                     >
 431                     <span>1</span>
 432                   </div>
 433                   <div ng-message="max">
 434                     <span
 435                       translate="OPENCHANNEL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
 436                       >queueTransferTimeout must be a valid greater or equal
 437                       than</span
 438                     >
 439                     <span>2147483</span>
 440                   </div>
 441                 </div>
 442               </md-input-container>
 443               <md-input-container class="md-block">
 444                 <md-switch
 445                   ng-model="vm.openchannelAccount.agentTransfer"
 446                   aria-label="agentTransfer"
 447                   ng-disabled="!vm.crudPermissions.canEdit"
 448                   ><span translate="OPENCHANNEL.AGENTTRANSFER"
 449                     >agentTransfer</span
 450                   ></md-switch
 451                 >
 452               </md-input-container>
 453               <md-input-container
 454                 ng-if="vm.openchannelAccount.agentTransfer == true"
 455                 class="md-block"
 456               >
 457                 <label translate="OPENCHANNEL.AGENTTRANSFERTIMEOUT"
 458                   >agentTransferTimeout</label
 459                 >
 460                 <input
 461                   type="number"
 462                   name="agentTransferTimeout"
 463                   ng-model="vm.openchannelAccount.agentTransferTimeout"
 464                   min="1"
 465                   max="2147483"
 466                   ng-required="true"
 467                   ng-disabled="!vm.crudPermissions.canEdit"
 468                 />
 469
 470                 <div
 471                   ng-messages="transferForm['agentTransferTimeout'].$error"
 472                   ng-show="transferForm['agentTransferTimeout'].$touched"
 473                   role="alert"
 474                 >
 475                   <div ng-message="required">
 476                     <span
 477                       translate="OPENCHANNEL.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
 478                       >agentTransferTimeout field is required</span
 479                     >
 480                   </div>
 481                   <div ng-message="min">
 482                     <span
 483                       translate="OPENCHANNEL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
 484                       >agentTransferTimeout must be a valid greater or equal
 485                       than</span
 486                     >
 487                     <span>1</span>
 488                   </div>
 489                   <div ng-message="max">
 490                     <span
 491                       translate="OPENCHANNEL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
 492                       >agentTransferTimeout must be a valid greater or equal
 493                       than</span
 494                     >
 495                     <span>2147483</span>
 496                   </div>
 497                 </div>
 498               </md-input-container>
 499             </form>
 500           </div>
 501         </md-tab-body>
 502       </md-tab>
 503       <md-tab>
 504         <md-tab-label>
 505           <span translate="OPENCHANNEL.ADVANCED">ADVANCED</span>
 506         </md-tab-label>
 507         <md-tab-body>
 508           <div
 509             class="openchannelAccount-detail-form-container proxy md-background-bg md-whiteframe-1dp"
 510           >
 511             <div class="pb-16" layout="row" layout-align="start center">
 512               <div class="h2 secondary-text" translate="OPENCHANNEL.PROXY">
 513                 PROXY
 514               </div>
 515             </div>
 516             <form name="proxyForm" novalidate>
 517               <md-input-container class="md-block">
 518                 <label translate="OPENCHANNEL.TOKEN">token</label>
 519                 <input
 520                   type="text"
 521                   name="token"
 522                   ng-model="vm.openchannelAccount.token"
 523                   autofocus
 524                   disabled
 525                 />
 526
 527                 <div class="hint">
 528                   <span translate="OPENCHANNEL.HELP.TOKEN"></span>
 529                 </div>
 530                 <div
 531                   ng-messages="proxyForm['token'].$error"
 532                   ng-show="proxyForm['token'].$touched"
 533                   role="alert"
 534                 >
 535                   <div ng-message="required">
 536                     <span translate="OPENCHANNEL.ERRORS.TOKEN_REQUIRED"
 537                       >token field is required</span
 538                     >
 539                   </div>
 540                 </div>
 541               </md-input-container>
 542             </form>
 543           </div>
 544           <div
 545             class="openchannelAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
 546           >
 547             <div class="pb-16" layout="row" layout-align="start center">
 548               <div
 549                 class="h2 secondary-text"
 550                 translate="OPENCHANNEL.DISPOSITION"
 551               >
 552                 DISPOSITION
 553               </div>
 554             </div>
 555             <form name="dispositionForm" novalidate>
 556               <md-input-container class="md-block">
 557                 <md-switch
 558                   ng-model="vm.openchannelAccount.mandatoryDisposition"
 559                   aria-label="MandatoryDisposition"
 560                   ng-disabled="!vm.crudPermissions.canEdit"
 561                   ><span translate="OPENCHANNEL.MANDATORYDISPOSITION"
 562                     >MandatoryDisposition</span
 563                   ></md-switch
 564                 >
 565               </md-input-container>
 566               <md-input-container
 567                 ng-if="vm.openchannelAccount.mandatoryDisposition"
 568                 class="md-block"
 569               >
 570                 <label translate="OPENCHANNEL.MANDATORYDISPOSITIONPAUSEID"
 571                   >MandatoryDispositionPauseId</label
 572                 >
 573                 <md-select
 574                   name="mandatoryDispositionPauseId"
 575                   ng-model="vm.openchannelAccount.mandatoryDispositionPauseId"
 576                   required
 577                   ng-disabled="!vm.crudPermissions.canEdit"
 578                 >
 579                   <md-option
 580                     ng-value="mandatoryDispositionPauseId.id"
 581                     ng-repeat="mandatoryDispositionPauseId in vm.pauses"
 582                     ng-disabled="mandatoryDispositionPauseId.canSelect === false"
 583                     >{{ mandatoryDispositionPauseId.name }}</md-option
 584                   >
 585                 </md-select>
 586                 <div class="hint">
 587                   <span
 588                     translate="OPENCHANNEL.HELP.MANDATORYDISPOSITIONPAUSEID"
 589                   ></span>
 590                 </div>
 591                 <div
 592                   ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
 593                   ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
 594                   role="alert"
 595                 >
 596                   <div ng-message="required">
 597                     <span
 598                       translate="OPENCHANNEL.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
 599                       >MandatoryDispositionPauseId field is required</span
 600                     >
 601                   </div>
 602                 </div>
 603               </md-input-container>
 604             </form>
 605           </div>
 606         </md-tab-body>
 607       </md-tab>
 608       <md-tab>
 609         <md-tab-label>
 610           <span translate="OPENCHANNEL.DISPOSITIONS">DISPOSITIONS</span>
 611         </md-tab-label>
 612         <md-tab-body>
 613           <div
 614             ng-controller="OpenchannelAccountDispositionsController as vm_dc"
 615             ng-init="vm_dc.init(vm.openchannelAccount, vm.crudPermissions)"
 616           >
 617             <div layout="row">
 618               <div class="column" flex="20">
 619                 <md-card class="mt-0">
 620                   <md-card-content>
 621                     <button
 622                       layout-align="center center"
 623                       md-mini-fab
 624                       ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
 625                     >
 626                       <div layout="row" layout-align="start center">
 627                         <md-icon md-font-icon="icon-refresh"></md-icon>
 628                         <span class="ph-5"
 629                           >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
 630                         >
 631                       </div>
 632                     </button>
 633                   </md-card-content>
 634                 </md-card>
 635                 <md-card>
 636                   <md-card-content>
 637                     <md-input-container class="md-block" flex-gt-sm="">
 638                       <label translate="TOOLS.SELECT_LEVEL"
 639                         >Select a level</label
 640                       >
 641                       <md-select
 642                         placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
 643                         ng-model="vm_dc.query.level"
 644                         ng-change="vm_dc.getDispositions()"
 645                       >
 646                         <md-option ng-value="null"
 647                           ><em translate="TOOLS.ALL">All</em></md-option
 648                         >
 649                         <md-option
 650                           ng-value="key"
 651                           ng-repeat="(key, value) in vm_dc.levels"
 652                           >{{ value }}</md-option
 653                         >
 654                       </md-select>
 655                     </md-input-container>
 656                   </md-card-content>
 657                 </md-card>
 658               </div>
 659               <div
 660                 class="openchannelAccount-detail-form-container openchanneldispositions md-background-bg md-whiteframe-1dp"
 661                 flex="80"
 662               >
 663                 <md-toolbar
 664                   class="md-table-toolbar md-default"
 665                   ng-hide="vm_dc.selectedOpenchannelAccountDispositions.length"
 666                 >
 667                   <div class="md-toolbar-tools">
 668                     <span
 669                       class="md-subhead"
 670                       translate="OPENCHANNEL.DISPOSITIONS"
 671                       >Dispositions</span
 672                     >
 673                     <ms-search-bar
 674                       on-search="vm_dc.query.filter = query"
 675                       on-collapse="vm_dc.query.filter = undefined"
 676                       debounce="300"
 677                       direction="down"
 678                     ></ms-search-bar>
 679                     <div flex></div>
 680                     <md-button
 681                       ng-if="vm_dc.crudPermissions.canEdit"
 682                       class="md-icon-button"
 683                       ng-click="vm_dc.createOrEditDisposition($event)"
 684                       aria-label="Add openchannel dispositions"
 685                       translate
 686                       translate-attr-label="OPENCHANNEL.ADD_DISPOSITION"
 687                     >
 688                       <md-icon md-font-icon="icon-plus"></md-icon>
 689                     </md-button>
 690                   </div>
 691                 </md-toolbar>
 692                 <md-toolbar
 693                   class="md-table-toolbar md-accent"
 694                   ng-show="vm_dc.selectedDispositions.length"
 695                 >
 696                   <div class="md-toolbar-tools">
 697                     <span class="md-subhead"
 698                       >{{vm_dc.selectedDispositions.length}}
 699                       {{vm_dc.selectedDispositions.length > 1 ? 'items' :
 700                       'item'}} selected</span
 701                     >
 702                     <div flex></div>
 703                     <button
 704                       class="md-icon-button"
 705                       ng-csv="vm_dc.exportSelectedDispositions"
 706                       csv-label="true"
 707                       filename="openchannelAccounts.csv"
 708                     >
 709                       <md-icon md-font-icon="icon-file-excel"></md-icon>
 710                     </button>
 711                     <md-button
 712                       ng-if="vm_dc.crudPermissions.canDelete"
 713                       class="md-icon-button"
 714                       ng-click="vm_dc.deleteSelectedDispositions($event)"
 715                       aria-label="delete selected"
 716                       translate
 717                       translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
 718                     >
 719                       <md-icon md-font-icon="icon-delete"></md-icon>
 720                     </md-button>
 721                   </div>
 722                 </md-toolbar>
 723                 <md-table-container>
 724                   <table
 725                     md-table
 726                     md-row-select
 727                     multiple
 728                     ng-model="vm_dc.selectedDispositions"
 729                     md-progress="vm_dc.promise"
 730                   >
 731                     <thead
 732                       md-head
 733                       md-order="vm_dc.query.sort"
 734                       md-on-reorder="vm_dc.getDispositions"
 735                     >
 736                       <tr md-row>
 737                         <th md-column md-order-by="id">
 738                           {{ 'OPENCHANNEL.ID' | translate }}
 739                         </th>
 740                         <th md-column md-order-by="level">
 741                           {{ 'TOOLS.LEVEL' | translate }}
 742                         </th>
 743                         <th md-column md-order-by="name">
 744                           {{ 'OPENCHANNEL.NAME' | translate }}
 745                         </th>
 746                         <th md-column md-order-by="description">
 747                           {{ 'OPENCHANNEL.DESCRIPTION' | translate }}
 748                         </th>
 749                         <th md-column width="10px"></th>
 750                       </tr>
 751                     </thead>
 752                     <tbody md-body>
 753                       <tr md-row ng-hide="vm_dc.dispositions.rows.length">
 754                         <td md-cell colspan="5">
 755                           <div layout="row" layout-align="center center">
 756                             <span translate="OPENCHANNEL.NO_AVAILABLE_INFO"
 757                               >No Available Info</span
 758                             >
 759                           </div>
 760                         </td>
 761                       </tr>
 762                       <tr
 763                         md-row
 764                         md-select="disposition"
 765                         md-select-id="id"
 766                         ng-repeat="disposition in vm_dc.dispositions.rows"
 767                       >
 768                         <td
 769                           ng-click="vm_dc.createOrEditDisposition($event, disposition)"
 770                           md-cell
 771                           class="id"
 772                         >
 773                           {{disposition.id}}
 774                         </td>
 775                         <td
 776                           ng-click="vm_dc.createOrEditDisposition($event, disposition)"
 777                           md-cell
 778                           class="level"
 779                         >
 780                           {{ vm_dc.levels[disposition.level] }}
 781                         </td>
 782                         <td
 783                           ng-click="vm_dc.createOrEditDisposition($event, disposition)"
 784                           md-cell
 785                           class="name"
 786                         >
 787                           {{disposition.name}}
 788                         </td>
 789                         <td
 790                           ng-click="vm_dc.createOrEditDisposition($event, disposition)"
 791                           md-cell
 792                           class="description"
 793                         >
 794                           {{disposition.description}}
 795                         </td>
 796                         <td
 797                           md-cell
 798                           class="actions"
 799                           ng-if="!vm_dc.crudPermissions.readOnly"
 800                         >
 801                           <md-menu>
 802                             <md-button
 803                               class="md-icon-button"
 804                               aria-label="More"
 805                               translate
 806                               translate-attr-aria-label="OPENCHANNEL.MORE"
 807                               ng-click="$mdOpenMenu($event)"
 808                             >
 809                               <md-icon
 810                                 md-font-icon="icon-dots-vertical"
 811                               ></md-icon>
 812                             </md-button>
 813                             <md-menu-content width="3">
 814                               <!-- SUBACTIONS -->
 815                               <!-- ACTIONS -->
 816                               <md-menu-item
 817                                 ng-if="vm_dc.crudPermissions.canEdit"
 818                               >
 819                                 <md-button
 820                                   ng-click="vm_dc.createOrEditDisposition($event, disposition)"
 821                                   translate="TOOLS.EDIT_DISPOSITION"
 822                                 >
 823                                   Edit Disposition
 824                                 </md-button>
 825                               </md-menu-item>
 826                               <!-- SUBACTIONS -->
 827                               <!-- ACTIONS -->
 828                               <md-menu-item
 829                                 ng-if="vm_dc.crudPermissions.canDelete"
 830                               >
 831                                 <md-button
 832                                   ng-click="vm_dc.deleteConfirm(disposition, $event)"
 833                                   translate="TOOLS.DELETE_DISPOSITION"
 834                                 >
 835                                   Delete Disposition
 836                                 </md-button>
 837                               </md-menu-item>
 838                             </md-menu-content>
 839                           </md-menu>
 840                         </td>
 841                       </tr>
 842                     </tbody>
 843                   </table>
 844                 </md-table-container>
 845                 <md-table-pagination
 846                   md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
 847                   md-limit="vm_dc.query.limit"
 848                   md-limit-options="[10, 15, 20, 50, 100, 250]"
 849                   md-page="vm_dc.query.page"
 850                   md-total="{{vm_dc.dispositions.count}}"
 851                   md-on-paginate="vm_dc.getDispositions"
 852                   md-page-select
 853                 >
 854                 </md-table-pagination>
 855               </div>
 856             </div>
 857           </div>
 858         </md-tab-body>
 859       </md-tab>
 860       <md-tab>
 861         <md-tab-label>
 862           <span translate="OPENCHANNEL.CANNEDANSWERS">CANNEDANSWERS</span>
 863         </md-tab-label>
 864         <md-tab-body>
 865           <div
 866             class="openchannelAccount-detail-form-container openchannelcannedanswers md-background-bg md-whiteframe-1dp"
 867           >
 868             <div
 869               ng-controller="OpenchannelAccountOpenchannelCannedAnswersController as vm_dc"
 870               ng-init="vm_dc.init(vm.openchannelAccount, vm.crudPermissions)"
 871             >
 872               <md-toolbar
 873                 class="md-table-toolbar md-default"
 874                 ng-hide="vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length"
 875               >
 876                 <div class="md-toolbar-tools">
 877                   <span
 878                     class="md-subhead"
 879                     translate="OPENCHANNEL.OPENCHANNELCANNEDANSWERS"
 880                     >OpenchannelCannedAnswers</span
 881                   >
 882                   <ms-search-bar
 883                     on-search="vm_dc.query.filter = query"
 884                     on-collapse="vm_dc.query.filter = undefined"
 885                     debounce="300"
 886                     direction="down"
 887                   ></ms-search-bar>
 888                   <div flex></div>
 889                   <md-button
 890                     ng-if="vm_dc.crudPermissions.canEdit"
 891                     class="md-icon-button"
 892                     ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event)"
 893                     aria-label="add openchannelCannedAnswer"
 894                     translate
 895                     translate-attr-label="OPENCHANNEL.ADD_OPENCHANNELCANNEDANSWER"
 896                   >
 897                     <md-icon md-font-icon="icon-plus"></md-icon>
 898                   </md-button>
 899                 </div>
 900               </md-toolbar>
 901               <md-toolbar
 902                 class="md-table-toolbar md-accent"
 903                 ng-show="vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length"
 904               >
 905                 <div class="md-toolbar-tools">
 906                   <span class="md-subhead"
 907                     >{{vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length}}
 908                     {{vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length
 909                     > 1 ? 'items' : 'item'}} selected</span
 910                   >
 911                   <div flex></div>
 912                   <button
 913                     class="md-icon-button"
 914                     ng-csv="vm_dc.exportSelectedOpenchannelAccountOpenchannelCannedAnswers"
 915                     csv-label="true"
 916                     filename="openchannelAccounts.csv"
 917                   >
 918                     <md-icon md-font-icon="icon-file-excel"></md-icon>
 919                   </button>
 920                   <md-button
 921                     ng-if="vm_dc.crudPermissions.canDelete"
 922                     class="md-icon-button"
 923                     ng-click="vm_dc.deleteSelectedOpenchannelAccountOpenchannelCannedAnswers($event)"
 924                     aria-label="delete selected"
 925                     translate
 926                     translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
 927                   >
 928                     <md-icon md-font-icon="icon-delete"></md-icon>
 929                   </md-button>
 930                 </div>
 931               </md-toolbar>
 932               <md-table-container class="font-size-12">
 933                 <table
 934                   md-table
 935                   md-row-select
 936                   multiple
 937                   ng-model="vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers"
 938                   md-progress="vm_dc.promise"
 939                 >
 940                   <thead
 941                     md-head
 942                     md-order="vm_dc.query.sort"
 943                     md-on-reorder="vm_dc.getOpenchannelAccountOpenchannelCannedAnswers"
 944                   >
 945                     <tr md-row>
 946                       <th md-column md-order-by="id">
 947                         {{ 'OPENCHANNEL.ID' | translate }}
 948                       </th>
 949                       <th md-column md-order-by="key">
 950                         {{ 'OPENCHANNEL.KEY' | translate }}
 951                       </th>
 952                       <th md-column md-order-by="value">
 953                         {{ 'OPENCHANNEL.VALUE' | translate }}
 954                       </th>
 955                       <th md-column md-order-by="description">
 956                         {{ 'OPENCHANNEL.DESCRIPTION' | translate }}
 957                       </th>
 958                       <th md-column md-order-by="createdAt">
 959                         {{ 'OPENCHANNEL.CREATED_AT' | translate }}
 960                       </th>
 961                       <th md-column width="10px"></th>
 962                     </tr>
 963                   </thead>
 964                   <tbody md-body>
 965                     <tr
 966                       md-row
 967                       md-select="openchannelCannedAnswer"
 968                       md-select-id="id"
 969                       ng-repeat="openchannelCannedAnswer in vm_dc.openchannelAccountOpenchannelCannedAnswers.rows"
 970                     >
 971                       <td
 972                         ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
 973                         md-cell
 974                       >
 975                         {{openchannelCannedAnswer.id}}
 976                       </td>
 977                       <td
 978                         ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
 979                         md-cell
 980                       >
 981                         {{openchannelCannedAnswer.key}}
 982                       </td>
 983                       <td
 984                         ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
 985                         md-cell
 986                       >
 987                         {{openchannelCannedAnswer.value}}
 988                       </td>
 989                       <td
 990                         ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
 991                         md-cell
 992                       >
 993                         {{openchannelCannedAnswer.description}}
 994                       </td>
 995                       <td
 996                         ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
 997                         md-cell
 998                       >
 999                         {{ openchannelCannedAnswer.createdAt | formatdate }}
1000                       </td>
1001                       <td
1002                         md-cell
1003                         class="actions"
1004                         ng-if="!vm_dc.crudPermissions.readOnly"
1005                       >
1006                         <md-menu>
1007                           <md-button
1008                             class="md-icon-button"
1009                             aria-label="More"
1010                             translate
1011                             translate-attr-aria-label="OPENCHANNEL.MORE"
1012                             ng-click="$mdOpenMenu($event)"
1013                           >
1014                             <md-icon
1015                               md-font-icon="icon-dots-vertical"
1016                             ></md-icon>
1017                           </md-button>
1018
1019                           <md-menu-content width="3">
1020                             <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
1021                               <md-button
1022                                 ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
1023                                 translate="OPENCHANNEL.EDIT_OPENCHANNELCANNEDANSWER"
1024                               >
1025                                 Edit OpenchannelCannedAnswer
1026                               </md-button>
1027                             </md-menu-item>
1028                             <md-menu-item
1029                               ng-if="vm_dc.crudPermissions.canDelete"
1030                             >
1031                               <md-button
1032                                 ng-click="vm_dc.deleteConfirm(openchannelCannedAnswer, $event)"
1033                                 translate="OPENCHANNEL.DELETE_OPENCHANNELCANNEDANSWER"
1034                               >
1035                                 Delete OpenchannelCannedAnswer
1036                               </md-button>
1037                             </md-menu-item>
1038                           </md-menu-content>
1039                         </md-menu>
1040                       </td>
1041                     </tr>
1042                     <tr
1043                       md-row
1044                       ng-if="!vm_dc.openchannelAccountOpenchannelCannedAnswers.rows.length"
1045                     >
1046                       <td md-cell colspan="7">
1047                         <div layout="row" layout-align="center center">
1048                           <span
1049                             class="text-boxed-light"
1050                             translate="OPENCHANNEL.NO_OPENCHANNELCANNEDANSWER_AVAILABLE"
1051                             >No openchannelcannedanswer available</span
1052                           >
1053                         </div>
1054                       </td>
1055                     </tr>
1056                   </tbody>
1057                 </table>
1058               </md-table-container>
1059               <md-table-pagination
1060                 md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
1061                 md-limit="vm_dc.query.limit"
1062                 md-limit-options="[10, 15, 20, 50, 100, 250]"
1063                 md-page="vm_dc.query.page"
1064                 md-total="{{vm_dc.openchannelAccountOpenchannelCannedAnswers.count}}"
1065                 md-on-paginate="vm_dc.getOpenchannelAccountOpenchannelCannedAnswers"
1066                 md-page-select
1067               ></md-table-pagination>
1068             </div>
1069           </div>
1070         </md-tab-body>
1071       </md-tab>
1072       <md-tab>
1073         <md-tab-label>
1074           <span translate="OPENCHANNEL.ACTIONS">ACTIONS</span>
1075         </md-tab-label>
1076         <md-tab-body>
1077           <div
1078             class="openchannelAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
1079           >
1080             <div
1081               ng-controller="OpenchannelAccountActionsController as vm_ac"
1082               ng-init="vm_ac.init(vm.openchannelAccount, vm.crudPermissions)"
1083               class="content"
1084               md-background-bg
1085               layout="row"
1086               layout-align="start start"
1087             >
1088               <!-- SIDENAV -->
1089               <div
1090                 class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
1091                 ms-scroll
1092                 layout="column"
1093                 flex="20"
1094                 ng-if="vm_ac.crudPermissions.canEdit"
1095               >
1096                 <!-- SIDENAV CONTENT -->
1097                 <md-list class="no-padding">
1098                   <md-subheader class="md-no-sticky">
1099                     <span translate="VOICE.APPLICATIONS_LIST">
1100                       Applications List
1101                     </span>
1102                   </md-subheader>
1103                 </md-list>
1104                 <md-divider></md-divider>
1105                 <md-list ng-sortable="vm_ac.list">
1106                   <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
1107                     <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
1108                     <p
1109                       class="text-truncate"
1110                       translate="OPENCHANNEL.{{(a.alias || a.appType) | uppercase}}"
1111                     >
1112                       {{a.alias || a.appType}}
1113                     </p>
1114                   </md-list-item>
1115                 </md-list>
1116                 <!-- / SIDENAV CONTENT -->
1117               </div>
1118               <!-- / SIDENAV -->
1119               <div flex></div>
1120               <!-- MAIN -->
1121               <div
1122                 class="main scrollable md-background-bg md-whiteframe-1dp"
1123                 ms-scroll
1124                 layout="column"
1125                 flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
1126               >
1127                 <md-toolbar
1128                   class="md-table-toolbar md-default"
1129                   ng-hide="vm_ac.selectedOpenchannelAccountApps.length"
1130                 >
1131                   <div class="md-toolbar-tools">
1132                     <span class="md-subhead">Drag & Drop Routing</span>
1133                     <div flex></div>
1134                     <ms-search-bar
1135                       on-search="vm_ac.query.filter = query"
1136                       on-collapse="vm_ac.query.filter = undefined"
1137                       debounce="300"
1138                     ></ms-search-bar>
1139                   </div>
1140                 </md-toolbar>
1141                 <md-toolbar
1142                   class="md-table-toolbar md-accent"
1143                   ng-show="vm_ac.selectedOpenchannelAccountApps.length"
1144                 >
1145                   <div class="md-toolbar-tools">
1146                     <span class="md-subhead"
1147                       >{{vm_ac.selectedOpenchannelAccountApps.length}}
1148                       {{vm_ac.selectedOpenchannelAccountApps.length > 1 ?
1149                       'items' : 'item'}} selected</span
1150                     >
1151                     <div flex></div>
1152                     <md-button
1153                       ng-if="vm_ac.crudPermissions.canDelete"
1154                       class="md-icon-button"
1155                       ng-click="vm_ac.deleteSelectedOpenchannelAccountApps($event)"
1156                       aria-label="delete selected"
1157                       translate
1158                       translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
1159                     >
1160                       <md-icon md-font-icon="icon-delete"></md-icon>
1161                     </md-button>
1162                   </div>
1163                 </md-toolbar>
1164
1165                 <!-- QUEUES TABLE -->
1166                 <md-table-container>
1167                   <table
1168                     md-table
1169                     md-row-select
1170                     multiple
1171                     ng-model="vm_ac.selectedOpenchannelAccountApps"
1172                   >
1173                     <thead md-head>
1174                       <tr md-row>
1175                         <th md-column width="10px"></th>
1176                         <th md-column width="10px">
1177                           <span translate="VOICE.PRIORITY">Priority</span>
1178                         </th>
1179                         <th md-column>
1180                           <span>Type</span>
1181                         </th>
1182                         <th md-column>
1183                           <span>Appdata</span>
1184                         </th>
1185                         <th md-column>
1186                           <span>Interval</span>
1187                         </th>
1188                         <th md-column width="10px"></th>
1189                         <th md-column width="10px"></th>
1190                       </tr>
1191                     </thead>
1192                     <tbody md-body ng-sortable="vm_ac.applications">
1193                       <tr
1194                         md-row
1195                         md-select="app"
1196                         md-select-id="id"
1197                         ng-repeat="app in vm_ac.openchannelAccountApps.rows | filter: vm_ac.query.filter"
1198                       >
1199                         <td md-cell>
1200                           <md-icon
1201                             md-font-icon="icon-drag-vertical"
1202                             class="s16 handle"
1203                           ></md-icon>
1204                         </td>
1205                         <td
1206                           md-cell
1207                           ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
1208                         >
1209                           <span>{{app.priority}}</span>
1210                         </td>
1211                         <td
1212                           md-cell
1213                           ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
1214                         >
1215                           {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
1216                           app.app | ucfirst}}<span
1217                             ng-if="app.appType.toLowerCase() === 'custom'"
1218                             >*</span
1219                           >
1220                         </td>
1221                         <td
1222                           md-cell
1223                           ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
1224                         >
1225                           <span class="text-truncate" style="width: 200px"
1226                             >{{app.appdata}}</span
1227                           >
1228                         </td>
1229                         <td
1230                           md-cell
1231                           ng-click="vm_ac.editInterval($event, $index)"
1232                         >
1233                           {{app.IntervalId ? 'From List' : app.interval}}
1234                         </td>
1235                         <td md-cell>
1236                           <md-button
1237                             ng-click="vm_ac.editInterval($event, $index)"
1238                             class="md-icon-button"
1239                             aria-label="Interval"
1240                           >
1241                             <md-icon md-font-icon="icon-timer"></md-icon>
1242                             <md-tooltip>
1243                               {{app.IntervalId ? 'From List' : (app.interval ===
1244                               '*,*,*,*' ? 'Always' : 'Custom')}}
1245                             </md-tooltip>
1246                           </md-button>
1247                         </td>
1248                         <td
1249                           md-cell
1250                           class="actions"
1251                           ng-if="!vm_ac.crudPermissions.readOnly"
1252                         >
1253                           <md-menu>
1254                             <md-button
1255                               class="md-icon-button"
1256                               aria-label="More"
1257                               translate
1258                               translate-attr-aria-label="VOICE.MORE"
1259                               ng-click="$mdOpenMenu($event)"
1260                             >
1261                               <md-icon
1262                                 md-font-icon="icon-dots-vertical"
1263                               ></md-icon>
1264                             </md-button>
1265
1266                             <md-menu-content width="3">
1267                               <md-menu-item
1268                                 ng-if="vm_ac.crudPermissions.canEdit"
1269                               >
1270                                 <md-button
1271                                   ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
1272                                   translate="VOICE.EDIT_APP"
1273                                 >
1274                                   Edit App
1275                                 </md-button>
1276                               </md-menu-item>
1277                               <md-menu-item
1278                                 ng-if="vm_ac.crudPermissions.canEdit"
1279                               >
1280                                 <md-button
1281                                   ng-click="vm_ac.editInterval($event, $index)"
1282                                   translate="VOICE.EDIT_INTERVAL"
1283                                 >
1284                                   Edit Interval
1285                                 </md-button>
1286                               </md-menu-item>
1287                               <md-menu-item
1288                                 ng-if="vm_ac.crudPermissions.canDelete"
1289                               >
1290                                 <md-button
1291                                   ng-click="vm_ac.deleteConfirm(app, $index, $event)"
1292                                   translate="VOICE.DELETE_APP"
1293                                 >
1294                                   Delete App
1295                                 </md-button>
1296                               </md-menu-item>
1297                             </md-menu-content>
1298                           </md-menu>
1299                         </td>
1300                       </tr>
1301                       <tr
1302                         md-row
1303                         ng-hide="vm_ac.openchannelAccountApps.rows.length"
1304                       >
1305                         <td md-cell colspan="7">
1306                           <span
1307                             class="text-boxed-light"
1308                             translate="VOICE.NO_APPS_AVAILABLE"
1309                             >No apps available</span
1310                           >
1311                         </td>
1312                       </tr>
1313                     </tbody>
1314                   </table>
1315                 </md-table-container>
1316                 <!-- / QUEUES TABLE -->
1317
1318                 <!-- NO RESULTS -->
1319
1320                 <!-- / NO RESULTS -->
1321               </div>
1322               <!-- / MAIN -->
1323             </div>
1324           </div>
1325         </md-tab-body>
1326       </md-tab>
1327       <md-tab>
1328         <md-tab-label>
1329           <span translate="OPENCHANNEL.INTERACTIONS">INTERACTIONS</span>
1330         </md-tab-label>
1331         <md-tab-body>
1332           <div
1333             class="openchannelAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
1334           >
1335             <div
1336               ng-controller="OpenchannelAccountInteractionsController as vm_dc"
1337               ng-init="vm_dc.init(vm.openchannelAccount, vm.crudPermissions)"
1338             >
1339               <md-toolbar
1340                 class="md-table-toolbar md-default"
1341                 ng-hide="vm_dc.selectedOpenchannelAccountInteractions.length"
1342               >
1343                 <div class="md-toolbar-tools">
1344                   <span class="md-subhead" translate="OPENCHANNEL.INTERACTIONS"
1345                     >Interactions</span
1346                   >
1347                   <ms-search-bar
1348                     on-search="vm_dc.query.filter = query"
1349                     on-collapse="vm_dc.query.filter = undefined"
1350                     debounce="300"
1351                     direction="down"
1352                   ></ms-search-bar>
1353                   <div flex></div>
1354                   <ms-quick-filter
1355                     filters="vm_dc.quickFilters"
1356                     query="vm_dc.query"
1357                     search="vm_dc.getOpenchannelAccountInteractions()"
1358                   ></ms-quick-filter>
1359                   <div layout="column">
1360                     <md-button
1361                       class="md-icon-button advanced-search"
1362                       ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
1363                       aria-label="Filter"
1364                       translate
1365                       translate-attr-aria-label="DASHBOARDS.FILTER"
1366                       ng-click="vm_dc.openAdvancedSearch()"
1367                     >
1368                       <md-icon
1369                         md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
1370                         ng-class="{ 'blink': vm_dc.query.search }"
1371                       ></md-icon>
1372                     </md-button>
1373                   </div>
1374                   <md-button
1375                     class="md-icon-button"
1376                     ng-click="vm_dc.getOpenchannelAccountInteractions()"
1377                     aria-label="refresh Interactions"
1378                     translate
1379                     translate-attr-label="OPENCHANNEL.REFRESH_INTERACTIONS"
1380                   >
1381                     <md-icon md-font-icon="icon-refresh"></md-icon>
1382                   </md-button>
1383                 </div>
1384               </md-toolbar>
1385               <md-toolbar
1386                 class="md-table-toolbar md-accent"
1387                 ng-show="vm_dc.selectedOpenchannelAccountInteractions.length"
1388               >
1389                 <div class="md-toolbar-tools">
1390                   <span class="md-subhead"
1391                     >{{vm_dc.selectedOpenchannelAccountInteractions.length}}
1392                     {{vm_dc.selectedOpenchannelAccountInteractions.length > 1 ?
1393                     'items' : 'item'}} selected</span
1394                   >
1395                   <div flex></div>
1396                   <button
1397                     class="md-icon-button"
1398                     ng-csv="vm_dc.exportSelectedOpenchannelAccountInteractions"
1399                     csv-label="true"
1400                     filename="openchannelAccounts.csv"
1401                   >
1402                     <md-icon md-font-icon="icon-file-excel"></md-icon>
1403                   </button>
1404                   <md-button
1405                     ng-if="vm_dc.crudPermissions.canDelete"
1406                     class="md-icon-button"
1407                     ng-click="vm_dc.deleteSelectedOpenchannelAccountInteractions($event)"
1408                     aria-label="delete selected"
1409                     translate
1410                     translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
1411                   >
1412                     <md-icon md-font-icon="icon-delete"></md-icon>
1413                   </md-button>
1414                 </div>
1415               </md-toolbar>
1416               <md-table-container class="font-size-12">
1417                 <table
1418                   md-table
1419                   md-row-select
1420                   multiple
1421                   ng-model="vm_dc.selectedOpenchannelAccountInteractions"
1422                   md-progress="vm_dc.promise"
1423                 >
1424                   <thead
1425                     md-head
1426                     md-order="vm_dc.query.sort"
1427                     md-on-reorder="vm_dc.getOpenchannelAccountInteractions"
1428                   >
1429                     <tr md-row>
1430                       <th md-column md-order-by="id">
1431                         {{ 'OPENCHANNEL.ID' | translate }}
1432                       </th>
1433                       <th md-column class="no-padding">
1434                         <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
1435                       </th>
1436                       <th md-column class="no-padding"></th>
1437                       <th md-column class="no-padding"></th>
1438                       <th md-column>{{ 'OPENCHANNEL.CONTACT' | translate }}</th>
1439                       <th md-column md-order-by="createdAt">
1440                         {{ 'OPENCHANNEL.STARTEDAT' | translate }}
1441                       </th>
1442                       <th md-column md-order-by="lastMsgAt">
1443                         {{ 'OPENCHANNEL.LASTMESSAGE' | translate }}
1444                       </th>
1445                       <th md-column md-order-by="closed">
1446                         {{ 'OPENCHANNEL.STATUS' | translate }}
1447                       </th>
1448                       <th md-column>{{ 'OPENCHANNEL.AGENT' | translate }}</th>
1449                       <th md-column md-order-by="tag">
1450                         {{ 'OPENCHANNEL.TAGS' | translate }}
1451                       </th>
1452                       <th md-column width="10px"></th>
1453                     </tr>
1454                   </thead>
1455                   <tbody md-body>
1456                     <tr
1457                       md-row
1458                       md-select="interaction"
1459                       md-select-id="id"
1460                       ng-repeat="interaction in vm_dc.openchannelAccountInteractions.rows"
1461                       ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
1462                     >
1463                       <td md-cell>{{interaction.id}}</td>
1464                       <td md-cell class="no-padding">
1465                         <div
1466                           ng-if="!interaction.closed && interaction.Users.length"
1467                         >
1468                           <md-icon
1469                             md-font-icon="icon-eye"
1470                             class="s16"
1471                           ></md-icon>
1472                           <md-tooltip>
1473                             <span ng-repeat="user in interaction.Users"
1474                               >{{ user.fullname | translate }}
1475                               <span ng-if="!$last">, </span>
1476                             </span>
1477                           </md-tooltip>
1478                         </div>
1479                       </td>
1480                       <td md-cell class="no-padding">
1481                         <div
1482                           ng-if="interaction.unreadMessages > 0"
1483                           layout="row"
1484                           layout-align="start center"
1485                         >
1486                           <span
1487                             class="badge white-fg md-primary-bg"
1488                             layout-margin
1489                             >{{ interaction.unreadMessages}}</span
1490                           >
1491                         </div>
1492                       </td>
1493                       <td md-cell class="no-padding">
1494                         <div ng-if="interaction.attach">
1495                           <md-icon
1496                             md-font-icon="icon-paperclip"
1497                             class="s16"
1498                           ></md-icon>
1499                         </div>
1500                       </td>
1501                       <td md-cell>
1502                         <div layout="column" layout-align="start start">
1503                           <span
1504                             class="font-size-12 text-truncate contact-text"
1505                             ng-class="{'margin-bottom-0' : interaction.contactInfo}"
1506                             layout-margin
1507                             >{{ interaction.contactName }}</span
1508                           >
1509                           <span
1510                             ng-if="interaction.contactInfo"
1511                             class="font-size-12 text-truncate contact-text margin-top-0"
1512                             layout-margin
1513                             >{{ interaction.contactInfo }}</span
1514                           >
1515                         </div>
1516                       </td>
1517                       <td md-cell>{{ interaction.createdAt | formatdate }}</td>
1518                       <td md-cell>
1519                         <div layout="row">
1520                           <span>
1521                             <md-icon
1522                               md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
1523                             ></md-icon>
1524                           </span>
1525                           <div layout="column" layout-align="center center">
1526                             <span class="text-truncate"
1527                               >{{ interaction.lastMsgAt | formatdate }}</span
1528                             >
1529                           </div>
1530                         </div>
1531                       </td>
1532                       <td md-cell>
1533                         <span ng-if="interaction.closed === 0" class="green-fg">
1534                           {{ 'OPENCHANNEL.OPENED' | translate }}
1535                           <span ng-if="interaction.substatus">
1536                             - {{ interaction.substatus }}
1537                           </span>
1538                         </span>
1539                         <span ng-if="interaction.closed === 1" class="red-fg">
1540                           {{ 'OPENCHANNEL.CLOSED' | translate }}
1541                           <span ng-if="interaction.disposition">
1542                             - {{ interaction.thirdDisposition ||
1543                             interaction.secondDisposition ||
1544                             interaction.disposition }}
1545                           </span>
1546                           <md-tooltip class="multiline">
1547                             <div layout="column">
1548                               <div layout="column">
1549                                 <span
1550                                   >{{ 'DASHBOARDS.CLOSED_AT' |
1551                                   translate}}:</span
1552                                 >
1553                                 <span class="text-bold"
1554                                   >{{ interaction.closedAt | formatdate }}</span
1555                                 >
1556                               </div>
1557                               <div
1558                                 ng-if="interaction.disposition"
1559                                 layout="column"
1560                               >
1561                                 <span
1562                                   >{{ 'DASHBOARDS.DISPOSITION' |
1563                                   translate}}:</span
1564                                 >
1565                                 <span class="text-bold"
1566                                   >{{ interaction.disposition }}</span
1567                                 >
1568                               </div>
1569                               <div
1570                                 ng-if="interaction.secondDisposition"
1571                                 layout="column"
1572                               >
1573                                 <span
1574                                   >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
1575                                   translate}}:</span
1576                                 >
1577                                 <span class="text-bold"
1578                                   >{{ interaction.secondDisposition }}</span
1579                                 >
1580                               </div>
1581                               <div
1582                                 ng-if="interaction.thirdDisposition"
1583                                 layout="column"
1584                               >
1585                                 <span
1586                                   >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
1587                                   translate}}:</span
1588                                 >
1589                                 <span class="text-bold"
1590                                   >{{ interaction.thirdDisposition }}</span
1591                                 >
1592                               </div>
1593                             </div>
1594                           </md-tooltip>
1595                         </span>
1596                       </td>
1597
1598                       <td md-cell>{{interaction.Owner.name}}</td>
1599                       <td md-cell>
1600                         <div ng-if="interaction.Tags.length">
1601                           <md-tooltip md-direction="left" layout="row">
1602                             <span ng-repeat="tag in interaction.Tags"
1603                               >{{tag.name}}<span ng-if="!$last">, </span></span
1604                             >
1605                           </md-tooltip>
1606                           <md-icon
1607                             md-font-icon="icon-tag"
1608                             ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
1609                           >
1610                           </md-icon>
1611                         </div>
1612                       </td>
1613                       <td md-cell class="actions">
1614                         <md-menu>
1615                           <md-button
1616                             class="md-icon-button"
1617                             aria-label="More"
1618                             translate
1619                             translate-attr-aria-label="OPENCHANNEL.MORE"
1620                             ng-click="$mdOpenMenu($event)"
1621                           >
1622                             <md-icon
1623                               md-font-icon="icon-dots-vertical"
1624                             ></md-icon>
1625                           </md-button>
1626
1627                           <md-menu-content width="3">
1628                             <md-menu-item>
1629                               <md-button
1630                                 ng-click="vm_dc.spyopenchannelInteraction($event, interaction)"
1631                                 translate="OPENCHANNEL.SPYINTERACTION"
1632                               >
1633                                 Spy Interaction
1634                               </md-button>
1635                             </md-menu-item>
1636                             <md-menu-item>
1637                               <md-button
1638                                 class="md-primary"
1639                                 ng-click="vm_dc.openchannelInteractionDownload(interaction, $event, true)"
1640                                 translate="OPENCHANNEL.DOWNLOAD_WITH_ATTACHMENTS"
1641                               >
1642                                 Download with attachments
1643                               </md-button>
1644                             </md-menu-item>
1645                             <md-menu-item>
1646                               <md-button
1647                                 class="md-primary"
1648                                 ng-click="vm_dc.openchannelInteractionDownload(interaction, $event)"
1649                                 translate="OPENCHANNEL.DOWNLOAD_WITHOUT_ATTACHMENTS"
1650                               >
1651                                 Download without attachments
1652                               </md-button>
1653                             </md-menu-item>
1654                             <md-menu-item
1655                               ng-if="vm_dc.crudPermissions.canDelete"
1656                             >
1657                               <md-button
1658                                 ng-click="vm_dc.deleteConfirm(interaction, $event)"
1659                                 translate="OPENCHANNEL.DELETE_INTERACTION"
1660                               >
1661                                 Delete Interaction
1662                               </md-button>
1663                             </md-menu-item>
1664                           </md-menu-content>
1665                         </md-menu>
1666                       </td>
1667                     </tr>
1668                     <tr
1669                       md-row
1670                       ng-if="!vm_dc.openchannelAccountInteractions.rows.length"
1671                     >
1672                       <td md-cell colspan="12">
1673                         <div layout="row" layout-align="center center">
1674                           <span
1675                             class="text-boxed-light"
1676                             translate="OPENCHANNEL.NO_INTERACTION_AVAILABLE"
1677                             >No interaction available</span
1678                           >
1679                         </div>
1680                       </td>
1681                     </tr>
1682                   </tbody>
1683                 </table>
1684               </md-table-container>
1685               <md-table-pagination
1686                 md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
1687                 md-limit="vm_dc.query.limit"
1688                 md-limit-options="[10, 15, 20, 50, 100, 250]"
1689                 md-page="vm_dc.query.page"
1690                 md-total="{{vm_dc.openchannelAccountInteractions.count}}"
1691                 md-on-paginate="vm_dc.getOpenchannelAccountInteractions"
1692                 md-page-select
1693               ></md-table-pagination>
1694             </div>
1695           </div>
1696         </md-tab-body>
1697       </md-tab>
1698     </md-tabs>
1699   </div>
1700   <!-- / CONTENT -->
1701 </div>