modules/yangman-resources/src/main/resources/yangman/views/popup/parameters-admin.tpl.html

   1 <md-dialog aria-label="{{'YANGMAN_PARAMETERS_ADMINISTRATION'| translate}}"  ng-cloak>
   2     <form name="paramsAdmin.paramsForm">
   3         <md-toolbar>
   4             <div class="md-toolbar-tools">
   5                 <h2>{{'YANGMAN_PARAMETERS_ADMINISTRATION'| translate}}</h2>
   6                 <span flex></span>
   7                 <md-button aria-label="{{'YANGMAN_CLOSE'| translate}}"
   8                            ng-click="paramsAdmin.close()">
   9                     <md-icon class="material-icons clickable" >
  10                         close
  11                     </md-icon>
  12                     <md-tooltip md-direction="bottom">{{'YANGMAN_CLOSE'| translate}}</md-tooltip>
  13                 </md-button>
  14             </div>
  15         </md-toolbar>
  16         <md-dialog-content class="paramsAdminDialog" layout="column">
  17             <div class="md-dialog-content" layout="column">
  18                 <!-- top part for search and sort bar -->
  19                 <div class="paramsAdminDialog__searchBox" layout="row">
  20
  21                     <!-- search icon, form, clear button -->
  22                     <md-icon class="material-icons">search</md-icon>
  23                     <input class=""
  24                            type="text"
  25                            flex
  26                            ng-change="paramsAdmin.filterChange()"
  27                            placeholder="{{'YANGMAN_SEARCH' | translate}}"
  28                            ng-model="paramsAdmin.search"
  29                            aria-invalid="false" />
  30                     <md-button aria-label="{{'YANGMAN_CLEAR_SEARCH'| translate}}"
  31                                ng-click="paramsAdmin.clearFilter()"
  32                                ng-if="paramsAdmin.search">
  33                         <md-icon class="material-icons clickable" >
  34                             close
  35                         </md-icon>
  36                         <md-tooltip md-direction="bottom">{{'YANGMAN_CLEAR_SEARCH'| translate}}</md-tooltip>
  37                     </md-button>
  38                     <!-- /search icon, form, clear button -->
  39
  40                     <!-- sorting menu -->
  41                     <md-menu md-offset="35 15" layout-align="center start">
  42                         <md-button aria-label="{{'YANGMAN_SORT'| translate}}" class="" ng-click="$mdOpenMenu()">
  43                             <i class="material-icons">sort</i>
  44                             <md-tooltip md-direction="bottom">
  45                                 {{'YANGMAN_SORTING' | translate}}
  46                             </md-tooltip>
  47                         </md-button>
  48                         <md-menu-content>
  49                             <!-- sort by name -->
  50                             <md-menu-item>
  51                                 <md-button aria-label="{{'YANGMAN_PARAMS_KEY'| translate}}"
  52                                            ng-click="paramsAdmin.sortBy('_name', '_value')">
  53                                     {{'YANGMAN_SORT_BY'| translate}}
  54                                     {{'YANGMAN_PARAMS_KEY'| translate}}
  55                                     {{paramsAdmin.sortAsc ? 'YANGMAN_SORT_DESC' : 'YANGMAN_SORT_ASC' | translate}}
  56                                 </md-button>
  57                             </md-menu-item>
  58                             <!-- /sort by name -->
  59
  60                             <!-- sort by value -->
  61                             <md-menu-item>
  62                                 <md-button aria-label="{{'YANGMAN_PARAMS_VALUE'| translate}}"
  63                                            ng-click="paramsAdmin.sortBy('_value', '_name')">
  64                                     {{'YANGMAN_SORT_BY'| translate}}
  65                                     {{'YANGMAN_PARAMS_VALUE'| translate}}
  66                                     {{paramsAdmin.sortAsc ? 'YANGMAN_SORT_DESC' : 'YANGMAN_SORT_ASC' | translate}}
  67                                 </md-button>
  68                             </md-menu-item>
  69                             <!-- /sort by value -->
  70
  71                         </md-menu-content>
  72                     </md-menu>
  73                     <!-- /sorting menu -->
  74
  75                     <!-- menu for import and export parameters -->
  76                     <input type="file" accept=".json" id="importParameters" on-read-file="paramsAdmin.importParameters($fileContent)">
  77                     <md-menu md-offset="35 15" layout-align="center start">
  78                         <md-button aria-label="{{ 'YANGMAN_PARAMS_IMPORT_EXPORT' | translate }}" ng-click="$mdOpenMenu()">
  79                             <i class="material-icons">import_export</i>
  80                             <md-tooltip md-direction="bottom">
  81                                 {{ 'YANGMAN_PARAMS_IMPORT_EXPORT' | translate }}
  82                             </md-tooltip>
  83                         </md-button>
  84                         <md-menu-content>
  85                             <md-menu-item>
  86                                 <md-button>
  87                                     <label for="importParameters">
  88                                         {{'YANGMAN_IMPORT_PARAMS'| translate}}
  89                                     </label>
  90                                 </md-button>
  91                             </md-menu-item>
  92                             <md-menu-item>
  93                                 <md-button aria-label="{{'YANGMAN_EXPORT_PARAMETERS' | translate}}" ng-click="paramsAdmin.exportParameters()">
  94                                     {{'YANGMAN_EXPORT_PARAMETERS' | translate}}
  95                                 </md-button>
  96                             </md-menu-item>
  97                         </md-menu-content>
  98                     </md-menu>
  99                     <!-- /menu for import and export parameters -->
 100
 101                 </div>
 102
 103                 <md-divider></md-divider>
 104                 <!-- /top part for search and sort bar -->
 105
 106                 <!-- parameters list -->
 107                 <md-content class="paramsAdminDialog__paramsList scrollableY" layout="column">
 108
 109                     <div layout="row"
 110                          ng-repeat="param in paramsAdmin.parametersList.list |
 111                                         filter: paramsAdmin.filterParam |
 112                                         orderBy: paramsAdmin.sortFunc : !paramsAdmin.sortAsc
 113                                         track by $index">
 114                         <!-- name input -->
 115                         <md-input-container>
 116                             <label>{{'YANGMAN_PARAM_KEY' | translate}}</label>
 117                             <input name="name_{{$index}}"
 118                                    ng-model="param.name"
 119                                    ng-required="param.value"
 120                                    ng-change="paramsAdmin.validateNamesUnique()"
 121                                    ng-focus="$last && paramsAdmin.createEmptyParam()"
 122                                    autocomplete="off">
 123                             <div ng-messages="paramsAdmin.paramsForm['name_'+$index].$error" multiple md-auto-hide="false">
 124                                 <div ng-message="required">
 125                                     {{'YANGMAN_PARAM_KEY_REQUIRED'| translate}}
 126                                 </div>
 127                                 <div ng-message="unique">
 128                                     {{'YANGMAN_PARAM_EXISTING_KEY'| translate}}
 129                                 </div>
 130                             </div>
 131                         </md-input-container>
 132                         <!-- / name input -->
 133
 134                         <!-- value input -->
 135                         <md-input-container flex>
 136                             <label>{{'YANGMAN_PARAM_VALUE' | translate}}</label>
 137                             <input ng-model="param.value" ng-focus="$last && paramsAdmin.createEmptyParam()">
 138                         </md-input-container>
 139                         <!-- /value input -->
 140
 141                         <!-- remove param button -->
 142                         <md-button aria-label="{{'YANGMAN_REMOVE_PARAM' | translate}}"
 143                                    class=""
 144                                    ng-if="!$last"
 145                                    ng-click="paramsAdmin.removeParam(param)">
 146                             <md-tooltip md-direction="bottom">
 147                                 {{'YANGMAN_REMOVE_PARAM' | translate}}
 148                             </md-tooltip>
 149                             <i class="material-icons">close</i>
 150                         </md-button>
 151                         <!-- /remove param button -->
 152
 153
 154                     </div>
 155                 </md-content>
 156                 <!-- /parameters list -->
 157
 158             </div>
 159         </md-dialog-content>
 160         <md-dialog-actions layout="row">
 161             <span flex></span>
 162             <md-button ng-click="paramsAdmin.close()">
 163                 {{'YANGMAN_CLOSE'| translate}}
 164             </md-button>
 165             <md-button ng-click="paramsAdmin.save()" ng-disabled="!paramsAdmin.paramsForm.$valid">
 166                 {{'YANGMAN_SAVE'| translate}}
 167             </md-button>
 168         </md-dialog-actions>
 169     </form>
 170 </md-dialog>