public/app/main/apps/sms/views/smsAccounts/edit/view.html

   1 <div id="sms-smsAccount" class="page-layout simple tabbed" layout="column">
   2
   3     <!-- HEADER -->
   4     <div class="header md-accent-bg" layout="row" layout-align="start center">
   5         <div class="white-fg" layout="row" layout-align="start center" flex>
   6             <md-button class="goto-smsAccounts-button md-icon-button" aria-label="Go to smsAccounts" ng-click="vm.gotoSmsAccounts()" translate translate-attr-aria-label="SMS.GO_TO_SMSACCOUNTS">
   7                 <md-icon md-font-icon="icon-arrow-left"></md-icon>
   8             </md-button>
   9
  10             <div layout="row" layout-align="start center">
  11
  12                 <div ng-if="vm.smsAccount.userpic" class="smsAccount-image" hide-xs>
  13                     <img ng-src="api/users/{{vm.smsAccount.id}}/avatar">
  14                 </div>
  15
  16                 <div ng-if="!vm.smsAccount.userpic" class="smsAccount-image" hide-xs>
  17                     <img ng-src="assets/images/business/smsAccounts.jpg">
  18                 </div>
  19
  20                 <div layout="column" layout-align="start start">
  21                     <div class="h2">
  22                         #{{vm.smsAccount.id}} {{vm.smsAccount.name}}
  23                     </div>
  24                     <div class="subtitle secondary-text">
  25                         <span translate="SMS.CREATED_AT"></span> <span>{{vm.smsAccount.createdAt | date:'medium'}}</span>
  26                     </div>
  27                 </div>
  28             </div>
  29         </div>
  30
  31         <div>
  32             <md-button type="submit" ng-click="vm.saveSmsAccount()" class="send-button md-accent md-raised" ng-disabled="(generalForm.$invalid) || (apiForm.$invalid) || (smsDispositionsForm.$invalid) || (acceptForm.$invalid) || (rejectForm.$invalid) || (closeForm.$invalid) || (actionsForm.$invalid)"
  33                 translate="SMS.SAVE" translate-attr-aria-label="SMS.SAVE">
  34                 SAVE
  35             </md-button>
  36         </div>
  37
  38     </div>
  39     <!-- / HEADER -->
  40
  41     <!-- CONTENT -->
  42     <div class="content">
  43
  44         <md-tabs md-selected="vm.selectedTab" md-dynamic-height>
  45             <md-tab>
  46                 <md-tab-label>
  47                     <span translate="SMS.SETTINGS">SETTINGS</span>
  48                 </md-tab-label>
  49
  50                 <md-tab-body>
  51                     <div class="smsAccount-detail-form-container general md-background-bg md-whiteframe-1dp">
  52                         <div class="pb-16" layout="row" layout-align="start center">
  53                             <div class="h2 secondary-text" translate="SMS.GENERAL">GENERAL</div>
  54                         </div>
  55                         <form name="generalForm" novalidate>
  56                             <md-input-container class="md-block">
  57                                 <label translate="SMS.NAME">Name</label>
  58                                 <input type="text" name="name" ng-model="vm.smsAccount.name" required md-autofocus>
  59                                 <div ng-messages="generalForm.name.$error" ng-show="generalForm.name.$touched" role="alert">
  60                                     <div ng-message="required">
  61                                         <span translate="SMS.ERRORS.NAME_REQUIRED">Name field is required</span>
  62                                     </div>
  63                                 </div>
  64                             </md-input-container>
  65                             <md-input-container class="md-block">
  66                                 <label translate="SMS.LIST">List</label>
  67                                 <md-select ng-model="vm.smsAccount.ListId">
  68                                     <md-option ng-value="ListId.id" ng-repeat="ListId in vm.lists">{{ ListId.name }}</md-option>
  69                                 </md-select>
  70                                 <div ng-messages="generalForm.ListId.$error" ng-show="generalForm.ListId.$touched" role="alert">
  71                                     <div ng-message="required">
  72                                         <span translate="SMS.ERRORS.LIST_REQUIRED">List field is required</span>
  73                                     </div>
  74                                 </div>
  75                             </md-input-container>
  76                             <md-input-container class="md-block">
  77                                 <md-switch ng-model="vm.smsAccount.fidelity" aria-label="fidelity"><span translate="SMS.FIDELITY">fidelity</span></md-switch>
  78                             </md-input-container>
  79                             <md-input-container ng-if="vm.smsAccount.fidelity" class="md-block">
  80                                 <label translate="SMS.TIMEOUT">Timeout</label>
  81                                 <input type="number" name="timeout" ng-model="vm.smsAccount.timeout" required>
  82                                 <div ng-messages="generalForm.timeout.$error" ng-show="generalForm.timeout.$touched" role="alert">
  83                                     <div ng-message="required">
  84                                         <span translate="SMS.ERRORS.TIMEOUT_REQUIRED">Timeout field is required</span>
  85                                     </div>
  86                                 </div>
  87                             </md-input-container>
  88                             <md-input-container class="md-block">
  89                                 <label translate="SMS.TYPE">Type</label>
  90                                 <md-select ng-model="vm.smsAccount.type" required>
  91                                     <md-option ng-value="'twilio'">Twilio</md-option>
  92                                     <md-option ng-value="'skebby'">Skebby</md-option>
  93                                 </md-select>
  94                                 <div ng-messages="generalForm.type.$error" ng-show="generalForm.type.$touched" role="alert">
  95                                     <div ng-message="required">
  96                                         <span translate="SMS.ERRORS.TYPE_REQUIRED">Type field is required</span>
  97                                     </div>
  98                                 </div>
  99                             </md-input-container>
 100                             <md-input-container ng-if="vm.smsAccount.type == 'skebby'" class="md-block">
 101                                 <label translate="SMS.SMSTYPE">smstype</label>
 102                                 <md-select ng-model="vm.smsAccount.smstype" required>
 103                                     <md-option ng-value="'basic'">Basic</md-option>
 104                                     <md-option ng-value="'classic'">Classic</md-option>
 105                                     <md-option ng-value="'classic+'">Classic+</md-option>
 106                                 </md-select>
 107                                 <div ng-messages="generalForm.smstype.$error" ng-show="generalForm.smstype.$touched" role="alert">
 108                                     <div ng-message="required">
 109                                         <span translate="SMS.ERRORS.SMSTYPE_REQUIRED">smstype field is required</span>
 110                                     </div>
 111                                 </div>
 112                             </md-input-container>
 113                             <md-input-container class="md-block">
 114                                 <label translate="SMS.PHONE">phone</label>
 115                                 <input type="text" name="phone" ng-model="vm.smsAccount.phone" required>
 116                                 <div ng-messages="generalForm.phone.$error" ng-show="generalForm.phone.$touched" role="alert">
 117                                     <div ng-message="required">
 118                                         <span translate="SMS.ERRORS.PHONE_REQUIRED">phone field is required</span>
 119                                     </div>
 120                                 </div>
 121                             </md-input-container>
 122                             <md-input-container ng-if="vm.smsAccount.type == 'twilio'" class="md-block">
 123                                 <label translate="SMS.SID">sid</label>
 124                                 <input type="text" name="sid" ng-model="vm.smsAccount.sid" required>
 125                                 <div ng-messages="generalForm.sid.$error" ng-show="generalForm.sid.$touched" role="alert">
 126                                     <div ng-message="required">
 127                                         <span translate="SMS.ERRORS.SID_REQUIRED">sid field is required</span>
 128                                     </div>
 129                                 </div>
 130                             </md-input-container>
 131                             <md-input-container ng-if="vm.smsAccount.type == 'twilio'" class="md-block">
 132                                 <label translate="SMS.TOKEN">token</label>
 133                                 <input type="text" name="token" ng-model="vm.smsAccount.token" required>
 134                                 <div ng-messages="generalForm.token.$error" ng-show="generalForm.token.$touched" role="alert">
 135                                     <div ng-message="required">
 136                                         <span translate="SMS.ERRORS.TOKEN_REQUIRED">token field is required</span>
 137                                     </div>
 138                                 </div>
 139                             </md-input-container>
 140                             <md-input-container ng-if="vm.smsAccount.type == 'skebby'" class="md-block">
 141                                 <label translate="SMS.USERNAME">username</label>
 142                                 <input type="text" name="username" ng-model="vm.smsAccount.username" required>
 143                                 <div ng-messages="generalForm.username.$error" ng-show="generalForm.username.$touched" role="alert">
 144                                     <div ng-message="required">
 145                                         <span translate="SMS.ERRORS.USERNAME_REQUIRED">username field is required</span>
 146                                     </div>
 147                                 </div>
 148                             </md-input-container>
 149                             <md-input-container class="md-block" ng-if="vm.smsAccount.type == 'skebby'">
 150                                 <label translate="SMS.PASSWORD">password</label>
 151                                 <input type="password" name="password" ng-model="vm.smsAccount.password" placeholder="Password" translate translate-attr-placeholder="SMS.PASSWORD" required>
 152                                 <div ng-messages="generalForm.password.$error" role="alert">
 153                                     <div ng-message="required">
 154                                         <span translate="SMS.ERRORS.PASSWORD_REQUIRED">Password field is required</span>
 155                                     </div>
 156                                 </div>
 157                             </md-input-container>
 158                             <md-input-container class="md-block" ng-if="vm.newSmsAccount  && vm.smsAccount.type == 'skebby'">
 159                                 <label translate="SMS.CONFIRM_PASSWORD">Confirm Password</label>
 160                                 <input type="password" match-password="password" name="confirmPassword" ng-model="confirmPassword">
 161                                 <div ng-messages="generalForm.confirmPassword.$error" role="alert" multiple>
 162                                     <div ng-message="required">
 163                                         <span translate="SMS.ERRORS.CONFIRM_REQUIRED">Confirm field is required</span>
 164                                     </div>
 165                                     <div ng-message="passwordMatch">
 166                                         <span translate="SMS.ERRORS.CONFIRM_NOT_MATCH">Your password did not match</span>
 167                                     </div>
 168                                 </div>
 169                             </md-input-container>
 170                             <md-input-container class="md-block">
 171                                 <label translate="SMS.MOTIONADDRESS">motionaddress</label>
 172                                 <input type="url" name="remote" ng-model="vm.smsAccount.remote" required>
 173                                 <div ng-messages="generalForm.remote.$error" ng-show="generalForm.remote.$touched" role="alert">
 174                                     <div ng-message="required">
 175                                         <span translate="SMS.ERRORS.MOTIONADDRESS_REQUIRED">motionaddress field is required</span>
 176                                     </div>
 177                                     <div ng-message="url">
 178                                         <span translate="SMS.ERRORS.MOTIONADDRESS_MUST_VALID_URL">motionaddress must be a valid url http://www.xcally.com</span>
 179                                     </div>
 180                                 </div>
 181                             </md-input-container>
 182                             <md-input-container class="md-block">
 183                                 <label translate="SMS.DESCRIPTION">Description</label>
 184                                 <input type="text" name="description" ng-model="vm.smsAccount.description">
 185                                 <div ng-messages="generalForm.description.$error" ng-show="generalForm.description.$touched" role="alert">
 186                                     <div ng-message="required">
 187                                         <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED">Description field is required</span>
 188                                     </div>
 189                                 </div>
 190                             </md-input-container>
 191
 192                         </form>
 193                     </div>
 194                 </md-tab-body>
 195             </md-tab>
 196             <md-tab>
 197                 <md-tab-label>
 198                     <span translate="SMS.API">API</span>
 199                 </md-tab-label>
 200
 201                 <md-tab-body>
 202                     <div class="smsAccount-detail-form-container api md-background-bg md-whiteframe-1dp">
 203                         <div class="pb-16" layout="row" layout-align="start center">
 204                             <div class="h2 secondary-text" translate="SMS.API">API</div>
 205                         </div>
 206                         <form name="apiForm" novalidate>
 207
 208                         </form>
 209                     </div>
 210                 </md-tab-body>
 211             </md-tab>
 212             <md-tab>
 213                 <md-tab-label>
 214                     <span translate="SMS.DISPOSITIONS">DISPOSITIONS</span>
 215                 </md-tab-label>
 216
 217                 <md-tab-body>
 218                     <div class="smsAccount-detail-form-container smsdispositions md-background-bg md-whiteframe-1dp">
 219                         <div ng-controller="SmsAccountSmsDispositionsController as vm_dc" ng-init="vm_dc.init(vm.smsAccount)">
 220                             <md-toolbar class="md-table-toolbar md-default" ng-hide="vm_dc.selectedSmsAccountSmsDispositions.length">
 221                                 <div class="md-toolbar-tools">
 222                                     <span class="md-subhead" translate="SMS.SMSDISPOSITIONS">SmsDispositions</span>
 223                                     <div flex></div>
 224                                     <ms-search-bar on-search="vm_dc.query.filter = query" on-collapse="vm_dc.query.filter = undefined" debounce="300"></ms-search-bar>
 225                                     <md-button class="md-icon-button" ng-click="vm_dc.createOrEditSmsAccountSmsDisposition($event)" aria-label="add smsDisposition" translate translate-attr-label="SMS.ADD_SMSDISPOSITION">
 226                                         <md-icon md-font-icon="icon-plus"></md-icon>
 227                                     </md-button>
 228                                 </div>
 229                             </md-toolbar>
 230                             <md-toolbar class="md-table-toolbar md-accent" ng-show="vm_dc.selectedSmsAccountSmsDispositions.length">
 231                                 <div class="md-toolbar-tools">
 232                                     <span class="md-subhead">{{vm_dc.selectedSmsAccountSmsDispositions.length}} {{vm_dc.selectedSmsAccountSmsDispositions.length > 1 ? 'items' : 'item'}} selected</span>
 233                                     <div flex></div>
 234                                     <md-button class="md-icon-button" ng-click="vm_dc.deleteSelectedSmsAccountSmsDispositions($event)" aria-label="delete selected" translate translate-attr-label="SMSACCOUNTS.DELETE_SELECTED">
 235                                         <md-icon md-font-icon="icon-delete"></md-icon>
 236                                     </md-button>
 237                                 </div>
 238                             </md-toolbar>
 239                             <md-table-container>
 240                                 <table md-table md-row-select multiple ng-model="vm_dc.selectedSmsAccountSmsDispositions" md-progress="vm_dc.promise">
 241                                     <thead md-head md-order="vm_dc.query.sort" md-on-reorder="vm_dc.getSmsAccountSmsDispositions">
 242                                         <tr md-row>
 243                                             <th md-column md-order-by="id">{{ 'SMS.ID' | translate }}</th>
 244                                             <th md-column md-order-by="name">{{ 'SMS.NAME' | translate }}</th>
 245                                             <th md-column md-order-by="createdAt">{{ 'SMS.CREATED_AT' | translate }}</th>
 246                                             <th md-column width="10px"></th>
 247                                         </tr>
 248                                     </thead>
 249                                     <tbody md-body>
 250                                         <tr md-row md-select="smsDisposition" md-select-id="id" ng-repeat="smsDisposition in vm_dc.smsAccountSmsDispositions.rows">
 251                                             <td ng-click="vm_dc.createOrEditSmsAccountSmsDisposition($event, smsDisposition)" md-cell>{{smsDisposition.id}}</td>
 252                                             <td ng-click="vm_dc.createOrEditSmsAccountSmsDisposition($event, smsDisposition)" md-cell>{{smsDisposition.name}}</td>
 253                                             <td ng-click="vm_dc.createOrEditSmsAccountSmsDisposition($event, smsDisposition)" md-cell>{{smsDisposition.createdAt | date:'medium'}}</td>
 254                                             <td md-cell class="actions">
 255                                                 <md-menu>
 256                                                     <md-button class="md-icon-button" aria-label="More" translate translate-attr-aria-label="SMS.MORE">
 257                                                         <md-icon md-font-icon="icon-dots-vertical" ng-click="$mdOpenMenu($event)"></md-icon>
 258                                                     </md-button>
 259
 260                                                     <md-menu-content width="3">
 261                                                         <md-menu-item>
 262                                                             <md-button ng-click="vm_dc.createOrEditSmsAccountSmsDisposition($event, smsDisposition)" translate="SMS.EDIT_SMSDISPOSITION">
 263                                                                 Edit SmsDisposition
 264                                                             </md-button>
 265                                                         </md-menu-item>
 266                                                         <md-menu-item>
 267                                                             <md-button ng-click="vm_dc.deleteConfirm(smsDisposition, $event)" translate="SMS.DELETE_SMSDISPOSITION">
 268                                                                 Delete SmsDisposition
 269                                                             </md-button>
 270                                                         </md-menu-item>
 271                                                     </md-menu-content>
 272                                                 </md-menu>
 273                                             </td>
 274                                         </tr>
 275                                         <tr md-row ng-if="!vm_dc.smsAccountSmsDispositions.rows.length">
 276                                             <td md-cell colspan="5">
 277                                                 <span class="text-boxed-ligth" translate="SMS.NO_SMSDISPOSITION_AVAILABLE">No smsdisposition available</span>
 278                                             </td>
 279                                         </tr>
 280                                     </tbody>
 281                                 </table>
 282                             </md-table-container>
 283                             <md-table-pagination md-limit="vm_dc.query.limit" md-limit-options="[10, 15, 20]" md-page="vm_dc.query.page" md-total="{{vm_dc.smsAccountSmsDispositions.count}}" md-on-paginate="vm_dc.getSmsAccountSmsDispositions" md-page-select></md-table-pagination>
 284                         </div>
 285
 286                     </div>
 287                 </md-tab-body>
 288             </md-tab>
 289             <md-tab>
 290                 <md-tab-label>
 291                     <span translate="SMS.WEBHOOKS">WEBHOOKS</span>
 292                 </md-tab-label>
 293
 294                 <md-tab-body>
 295                     <div class="smsAccount-detail-form-container accept md-background-bg md-whiteframe-1dp">
 296                         <div class="pb-16" layout="row" layout-align="start center">
 297                             <div class="h2 secondary-text" translate="SMS.ACCEPT">ACCEPT</div>
 298                         </div>
 299                         <form name="acceptForm" novalidate>
 300                             <md-input-container class="md-block">
 301                                 <label translate="SMS.ACCEPTMETHOD">acceptMethod</label>
 302                                 <md-select ng-model="vm.smsAccount.acceptMethod" md-autofocus>
 303                                     <md-option ng-value="'GET'">HTTP GET</md-option>
 304                                     <md-option ng-value="'POST'">HTTP POST</md-option>
 305                                 </md-select>
 306                                 <div ng-messages="acceptForm.acceptMethod.$error" ng-show="acceptForm.acceptMethod.$touched" role="alert">
 307                                     <div ng-message="required">
 308                                         <span translate="SMS.ERRORS.ACCEPTMETHOD_REQUIRED">acceptMethod field is required</span>
 309                                     </div>
 310                                 </div>
 311                             </md-input-container>
 312                             <md-input-container class="md-block">
 313                                 <label translate="SMS.ACCEPTURL">acceptUrl</label>
 314                                 <input type="url" name="acceptUrl" ng-model="vm.smsAccount.acceptUrl">
 315                                 <div ng-messages="acceptForm.acceptUrl.$error" ng-show="acceptForm.acceptUrl.$touched" role="alert">
 316                                     <div ng-message="required">
 317                                         <span translate="SMS.ERRORS.ACCEPTURL_REQUIRED">acceptUrl field is required</span>
 318                                     </div>
 319                                     <div ng-message="url">
 320                                         <span translate="SMS.ERRORS.ACCEPTURL_MUST_VALID_URL">acceptUrl must be a valid url http://www.xcally.com</span>
 321                                     </div>
 322                                 </div>
 323                             </md-input-container>
 324
 325                         </form>
 326                     </div>
 327                     <div class="smsAccount-detail-form-container reject md-background-bg md-whiteframe-1dp">
 328                         <div class="pb-16" layout="row" layout-align="start center">
 329                             <div class="h2 secondary-text" translate="SMS.REJECT">REJECT</div>
 330                         </div>
 331                         <form name="rejectForm" novalidate>
 332                             <md-input-container class="md-block">
 333                                 <label translate="SMS.REJECTMETHOD">rejectMethod</label>
 334                                 <md-select ng-model="vm.smsAccount.rejectMethod" md-autofocus>
 335                                     <md-option ng-value="'GET'">HTTP GET</md-option>
 336                                     <md-option ng-value="'POST'">HTTP POST</md-option>
 337                                 </md-select>
 338                                 <div ng-messages="rejectForm.rejectMethod.$error" ng-show="rejectForm.rejectMethod.$touched" role="alert">
 339                                     <div ng-message="required">
 340                                         <span translate="SMS.ERRORS.REJECTMETHOD_REQUIRED">rejectMethod field is required</span>
 341                                     </div>
 342                                 </div>
 343                             </md-input-container>
 344                             <md-input-container class="md-block">
 345                                 <label translate="SMS.REJECTURL">rejectUrl</label>
 346                                 <input type="url" name="rejectUrl" ng-model="vm.smsAccount.rejectUrl">
 347                                 <div ng-messages="rejectForm.rejectUrl.$error" ng-show="rejectForm.rejectUrl.$touched" role="alert">
 348                                     <div ng-message="required">
 349                                         <span translate="SMS.ERRORS.REJECTURL_REQUIRED">rejectUrl field is required</span>
 350                                     </div>
 351                                     <div ng-message="url">
 352                                         <span translate="SMS.ERRORS.REJECTURL_MUST_VALID_URL">rejectUrl must be a valid url http://www.xcally.com</span>
 353                                     </div>
 354                                 </div>
 355                             </md-input-container>
 356
 357                         </form>
 358                     </div>
 359                     <div class="smsAccount-detail-form-container close md-background-bg md-whiteframe-1dp">
 360                         <div class="pb-16" layout="row" layout-align="start center">
 361                             <div class="h2 secondary-text" translate="SMS.CLOSE">CLOSE</div>
 362                         </div>
 363                         <form name="closeForm" novalidate>
 364                             <md-input-container class="md-block">
 365                                 <label translate="SMS.CLOSEMETHOD">closeMethod</label>
 366                                 <md-select ng-model="vm.smsAccount.closeMethod" md-autofocus>
 367                                     <md-option ng-value="'GET'">HTTP GET</md-option>
 368                                     <md-option ng-value="'POST'">HTTP POST</md-option>
 369                                 </md-select>
 370                                 <div ng-messages="closeForm.closeMethod.$error" ng-show="closeForm.closeMethod.$touched" role="alert">
 371                                     <div ng-message="required">
 372                                         <span translate="SMS.ERRORS.CLOSEMETHOD_REQUIRED">closeMethod field is required</span>
 373                                     </div>
 374                                 </div>
 375                             </md-input-container>
 376                             <md-input-container class="md-block">
 377                                 <label translate="SMS.CLOSEURL">closeUrl</label>
 378                                 <input type="url" name="closeUrl" ng-model="vm.smsAccount.closeUrl">
 379                                 <div ng-messages="closeForm.closeUrl.$error" ng-show="closeForm.closeUrl.$touched" role="alert">
 380                                     <div ng-message="required">
 381                                         <span translate="SMS.ERRORS.CLOSEURL_REQUIRED">closeUrl field is required</span>
 382                                     </div>
 383                                     <div ng-message="url">
 384                                         <span translate="SMS.ERRORS.CLOSEURL_MUST_VALID_URL">closeUrl must be a valid url http://www.xcally.com</span>
 385                                     </div>
 386                                 </div>
 387                             </md-input-container>
 388
 389                         </form>
 390                     </div>
 391                 </md-tab-body>
 392             </md-tab>
 393             <md-tab>
 394                 <md-tab-label>
 395                     <span translate="SMS.ACTIONS">ACTIONS</span>
 396                 </md-tab-label>
 397
 398                 <md-tab-body>
 399                     <div class="smsAccount-detail-form-container actions md-background-bg md-whiteframe-1dp">
 400                         <div class="pb-16" layout="row" layout-align="start center">
 401                             <div class="h2 secondary-text" translate="SMS.ACTIONS">ACTIONS</div>
 402                         </div>
 403                         <form name="actionsForm" novalidate>
 404
 405                         </form>
 406                     </div>
 407                 </md-tab-body>
 408             </md-tab>
 409         </md-tabs>
 410
 411     </div>
 412     <!-- / CONTENT -->
 413
 414 </div>