Built motion from commit e493b9a4954b50a8ee6d0034ba3601cd210d989d. Version 3.0.0...
[motion-next.git] / public / templates / main / apps / integrations / views / deskAccounts / edit / view.html / view.html
diff --git a/public/templates/main/apps/integrations/views/deskAccounts/edit/view.html/view.html b/public/templates/main/apps/integrations/views/deskAccounts/edit/view.html/view.html
new file mode 100644 (file)
index 0000000..9042b1d
--- /dev/null
@@ -0,0 +1,987 @@
+<div
+  id="integrations-deskAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-deskAccounts-button md-icon-button"
+        aria-label="Go to deskAccounts"
+        ng-click="vm.gotoDeskAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_DESKACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="deskAccount-image" hide-xs>
+          <img ng-src="assets/images/business/deskAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.deskAccount.id}}
+            <span ng-if="vm.deskAccount.name">{{vm.deskAccount.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="APP.CREATED_AT"></span>
+            <span>{{vm.deskAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveDeskAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="APP.SAVE"
+        translate-attr-aria-label="APP.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="APP.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="deskAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="APP.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="APP.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.deskAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="APP.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="APP.TYPE">Type</label>
+                <md-select
+                  name="type"
+                  ng-model="vm.deskAccount.type"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'integrationTab'">
+                    {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'newTab'">
+                    {{ 'APP.NEW_TAB' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['type'].$error"
+                  ng-show="generalForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="APP.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.URI">Uri</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.deskAccount.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+                      >Uri field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+                      >Uri must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
+                <md-select
+                  name="authType"
+                  ng-model="vm.deskAccount.authType"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'basic'">Basic</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['authType'].$error"
+                  ng-show="generalForm['authType'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
+                      >AuthType field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.deskAccount.authType == 'basic'"
+                class="md-block"
+              >
+                <label translate="APP.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.deskAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="APP.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                class="md-block"
+                ng-if="vm.deskAccount.authType == 'basic'"
+              >
+                <label translate="APP.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="password"
+                  ng-model="vm.deskAccount.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="APP.PASSWORD"
+                  required
+                />
+                <div ng-messages="generalForm['password'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="APP.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.deskAccount.serverUrl"
+                  ng-required="true"
+                  value="LOCALIP"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="APP.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.deskAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="deskAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="DeskAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.deskAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditDeskConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create deskConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="deskConfiguration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedDeskConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getDeskConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ deskConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="APP.MORE"
+                        ng-click="$mdMenu.open($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteDeskConfiguration($event, deskConfiguration)"
+                            translate="INTEGRATIONS.DELETE_DESKCONFIGURATION"
+                          >
+                            Delete DeskConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="APP.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>{{ 'APP.ID' | translate }}</th>
+                              <th md-column>{{ 'APP.TYPE' | translate }}</th>
+                              <th md-column>{{ 'APP.CONTENT' | translate }}</th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="APP.MORE"
+                                    ng-click="$mdMenu.open($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="APP.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>{{ 'APP.ID' | translate }}</th>
+                              <th md-column>{{ 'APP.TYPE' | translate }}</th>
+                              <th md-column>{{ 'APP.CONTENT' | translate }}</th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="APP.MORE"
+                                    ng-click="$mdMenu.open($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="APP.FIELDS">FIELDS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.field = query"
+                            on-collapse="vm_cc.query.field = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditField($event)"
+                            aria-label="add field"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedFields.length}}
+                            {{vm_cc.selectedFields.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedFields($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="APP.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedFields"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>{{ 'APP.ID' | translate }}</th>
+                              <th md-column>{{ 'APP.TYPE' | translate }}</th>
+                              <th md-column>{{ 'APP.CONTENT' | translate }}</th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="field"
+                              md-select-id="id"
+                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="id"
+                              >
+                                {{field.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="field.FieldId"
+                                  >{{field.nameField || field.idField}}</span
+                                >
+                                <span ng-if="!field.FieldId"
+                                  >{{field.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="field.type"
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{field.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{field.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{ vm_cc.variablesById[field.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{field.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{field.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{field.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[field.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default>{{field.content}}</span>
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="APP.MORE"
+                                    ng-click="$mdMenu.open($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditField($event, field)"
+                                        translate="INTEGRATIONS.EDIT_FIELD"
+                                      >
+                                        Edit Field
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
+                                        translate="INTEGRATIONS.DELETE_FIELD"
+                                      >
+                                        Delete Field
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="APP.TAGS">TAGS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-table-container class="md-whiteframe-1dp padding-20">
+                        <md-input-container class="md-block">
+                          <label translate="APP.TAGS">Tags</label>
+                          <md-select
+                            ng-model="vm_cc.selectedTags"
+                            ng-change="vm_cc.selectTagsChanged($event)"
+                            multiple
+                          >
+                            <md-option
+                              ng-value="tag.id"
+                              ng-repeat="tag in vm_cc.tags"
+                              >{{ tag.name }}</md-option
+                            >
+                          </md-select>
+                        </md-input-container>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditDeskConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>