674301c79b251b20d91210e5ad5eb6789570c699
[motion-next.git] /
1 <div
2   id="internalroutes"
3   class="page-layout simple left-sidenav inner-sidenav motion-list"
4 >
5   <!-- HEADER -->
6   <div
7     class="header md-accent-bg"
8     layout="row"
9     layout-align="space-between center"
10   >
11     <!-- APP TITLE -->
12     <div layout="row" layout-align="start center">
13       <div class="logo" layout="row" layout-align="start center">
14         <span class="logo-icon">
15           <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
16         </span>
17         <span class="logo-text" translate="VOICE.INTERNALROUTES"
18           >InternalRoutes</span
19         >
20       </div>
21     </div>
22     <!-- / APP TITLE -->
23
24     <div layout="row">
25       <!-- SEARCH -->
26       <div
27         class="search-input-wrapper"
28         layout="row"
29         layout-align="start center"
30       >
31         <label for="search">
32           <md-icon md-font-icon="icon-magnify"></md-icon>
33         </label>
34         <md-input-container md-no-float class="m-0">
35           <input
36             id="search"
37             placeholder="Search for anyone"
38             type="text"
39             ng-model="vm.query.filter"
40             ng-model-options="{ debounce: 1000 }"
41             translate
42             translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
43           />
44         </md-input-container>
45       </div>
46       <!-- / SEARCH -->
47     </div>
48   </div>
49   <!-- / HEADER -->
50
51   <!-- SELECTED BAR -->
52   <div
53     ng-show="vm.selectedInternalRoutes.length > 0"
54     class="selected-bar header animate-slide-down md-accent-bg"
55     layout="row"
56     layout-align="start center"
57   >
58     <div class="close-button-wrapper" ng-click="vm.selectedInternalRoutes =[]">
59       <md-button layout="row" layout-align="start center">
60         <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
61         <span translate="VOICE.BACK">Back</span>
62       </md-button>
63     </div>
64
65     <div flex layout="row" layout-align="space-between center">
66       <div>
67         <span class="selected-internalroutes-count">
68           <span>{{vm.selectedInternalRoutes.length}}</span>
69           <span translate="VOICE.SELECTED">selected</span>
70         </span>
71
72         <md-menu class="select-menu" ng-if="!vm.currentThread">
73           <md-button
74             class="md-icon-button"
75             ng-click="$mdMenu.open($event)"
76             aria-label="multi select toggle"
77             translate
78             translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
79           >
80             <md-icon md-font-icon="icon-menu-down"></md-icon>
81           </md-button>
82           <md-menu-content width="3">
83             <md-menu-item>
84               <md-button
85                 ng-click="vm.selectAllInternalRoutes()"
86                 translate="VOICE.SELECT_ALL"
87               >
88                 Select all
89               </md-button>
90             </md-menu-item>
91             <md-menu-item>
92               <md-button
93                 ng-click="vm.deselectInternalRoutes()"
94                 translate="VOICE.SELECT_NONE"
95               >
96                 Select none
97               </md-button>
98             </md-menu-item>
99           </md-menu-content>
100         </md-menu>
101       </div>
102
103       <div class="multi-select-actions">
104         <button
105           class="md-icon-button"
106           ng-csv="vm.exportSelectedInternalRoutes"
107           csv-label="true"
108           filename="internalroutes.csv"
109         >
110           <md-icon md-font-icon="icon-file-excel"></md-icon>
111         </button>
112         <md-button
113           class="md-icon-button"
114           ng-if="vm.crudPermissions.canDelete"
115           ng-click="vm.deleteSelectedInternalRoutes($event)"
116           aria-label="delete selected"
117           translate
118           translate-attr-label="VOICE.DELETE_SELECTED"
119         >
120           <md-icon md-font-icon="icon-delete"></md-icon>
121         </md-button>
122       </div>
123     </div>
124   </div>
125   <!-- / SELECTED BAR -->
126
127   <!-- CONTENT -->
128   <div class="content" md-background-bg layout="row" layout-align="start start">
129     <!-- MAIN -->
130     <div class="main scrollable" ms-scroll>
131       <!-- INTERNALROUTE TABLE -->
132       <md-card>
133         <md-table-container>
134           <table
135             md-table
136             md-row-select
137             multiple
138             ng-model="vm.selectedInternalRoutes"
139             md-progress="vm.promise"
140           >
141             <thead
142               md-head
143               md-order="vm.query.sort"
144               md-on-reorder="vm.getInternalRoutes"
145             >
146               <tr md-row>
147                 <th
148                   md-column
149                   ng-if="vm.table == 'users' || vm.table == 'agents'"
150                   width="20px"
151                 ></th>
152                 <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
153                 <th md-column md-order-by="exten">
154                   {{ 'VOICE.PHONENUMBER' | translate }}
155                 </th>
156                 <th md-column md-order-by="description">
157                   {{ 'VOICE.DESCRIPTION' | translate }}
158                 </th>
159                 <th md-column width="10px"></th>
160               </tr>
161             </thead>
162             <tbody md-body>
163               <tr md-row ng-hide="vm.internalroutes.rows.length">
164                 <td md-cell colspan="4">
165                   <div layout="row" layout-align="center center">
166                     <span translate="VOICE.NO_AVAILABLE_INFO"
167                       >No Available Info</span
168                     >
169                   </div>
170                 </td>
171               </tr>
172               <tr
173                 md-row
174                 md-select="internalroute"
175                 md-select-id="id"
176                 ng-repeat="internalroute in vm.internalroutes.rows"
177               >
178                 <td md-cell ng-if="internalroute.userpic">
179                   <img
180                     class="avatar"
181                     alt="{{internalroute.name}}"
182                     ng-src="api/users/{{internalroute.id}}/avatar"
183                   />
184                 </td>
185                 <td
186                   md-cell
187                   ng-if="!internalroute.userpic && (vm.table == 'users' || vm.table == 'agents')"
188                 >
189                   <img
190                     class="avatar"
191                     alt="{{internalroute.name}}"
192                     ng-src="assets/images/avatars/profile.png"
193                   />
194                 </td>
195                 <td
196                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(internalroute, ev) : vm.createOrEditInternalRoute($event, internalroute)"
197                   md-cell
198                   class="id"
199                 >
200                   {{internalroute.id}}
201                 </td>
202                 <td
203                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(internalroute, ev) : vm.createOrEditInternalRoute($event, internalroute)"
204                   md-cell
205                   class="exten"
206                 >
207                   {{internalroute.exten}}
208                 </td>
209                 <td
210                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(internalroute, ev) : vm.createOrEditInternalRoute($event, internalroute)"
211                   md-cell
212                   class="description"
213                 >
214                   {{internalroute.description}}
215                 </td>
216
217                 <td
218                   md-cell
219                   class="actions"
220                   ng-if="!vm.crudPermissions.readOnly"
221                 >
222                   <md-menu>
223                     <md-button
224                       class="md-icon-button"
225                       aria-label="More"
226                       translate
227                       translate-attr-aria-label="VOICE.MORE"
228                       ng-click="$mdMenu.open($event)"
229                     >
230                       <md-icon md-font-icon="icon-dots-vertical"></md-icon>
231                     </md-button>
232
233                     <md-menu-content width="3">
234                       <!-- SUBACTIONS -->
235
236                       <!-- ACTIONS -->
237
238                       <md-menu-item ng-if="vm.crudPermissions.canEdit">
239                         <md-button
240                           ng-click="vm.editstate(internalroute, $event    )"
241                           translate="VOICE.EDIT_INTERNALROUTE"
242                         >
243                           Edit InternalRoute
244                         </md-button>
245                       </md-menu-item>
246
247                       <!-- SUBACTIONS -->
248
249                       <!-- ACTIONS -->
250
251                       <md-menu-item ng-if="vm.crudPermissions.canDelete">
252                         <md-button
253                           ng-click="vm.deleteconfirm(internalroute, $event    )"
254                           translate="VOICE.DELETE_INTERNALROUTE"
255                         >
256                           Delete InternalRoute
257                         </md-button>
258                       </md-menu-item>
259                     </md-menu-content>
260                   </md-menu>
261                 </td>
262               </tr>
263             </tbody>
264           </table>
265         </md-table-container>
266
267         <md-table-pagination
268           md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
269           md-limit="vm.query.limit"
270           md-limit-options="[10, 15, 20, 50, 100, 250]"
271           md-page="vm.query.page"
272           md-total="{{vm.internalroutes.count}}"
273           md-on-paginate="vm.getInternalRoutes"
274           md-page-select
275         ></md-table-pagination>
276       </md-card>
277       <!-- / INTERNALROUTE TABLE -->
278       <!-- NO RESULTS -->
279
280       <!-- / NO RESULTS -->
281     </div>
282     <!-- / MAIN -->
283   </div>
284   <!-- / CONTENT -->
285
286   <!-- ADD INTERNALROUTE BUTTON -->
287   <md-button
288     ng-if="vm.crudPermissions.canEdit"
289     class="md-fab md-accent add-item-button"
290     id="add-internalroute-button"
291     ng-click="vm.createOrEditInternalRoute($event)"
292     aria-label="add internalroute"
293     translate
294     translate-attr-aria-label="VOICE.ADD_INTERNALROUTE"
295   >
296     <md-icon md-font-icon="icon-plus"></md-icon>
297   </md-button>
298   <!-- / ADD INTERNALROUTE BUTTON -->
299 </div>