public/app/main/apps/contactmanager/views/contacts/upload/upload.html

   1 <md-dialog class="upload-dialog" aria-label="Upload contact">
   2     <form name="uploadForm" class="md-inline-form" novalidate>
   3         <md-toolbar class="md-accent md-hue-2">
   4             <div class="md-toolbar-tools" layout="row" layout-align="space-between center">
   5                 <span class="title" translate="CONTACTMANAGER.UPLOAD_CONTACTS">Upload Contacts</span>
   6                 <md-button ng-disabled="vm.uploading" class="md-icon-button" ng-click="vm.closeDialog()">
   7                     <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
   8                 </md-button>
   9             </div>
  10         </md-toolbar>
  11
  12         <div md-background-bg layout="row" layout-align="start start">
  13             <md-progress-linear ng-disabled="!vm.uploading" md-mode="indeterminate" class="md-warn"></md-progress-linear>
  14         </div>
  15
  16         <md-dialog-content ms-scroll>
  17             <div class="error-list">
  18                 <div ng-repeat="error in vm.errors" class="error" layout="row" layout-align="space-between center">
  19                     <div>
  20                         <span class="message">{{error.message}}</span>
  21                         <span class="type">({{error.type}})</span>
  22                     </div>
  23                     <md-button class="md-icon-button">
  24                         <md-icon md-font-icon="icon-alert-box" aria-label="alert error" class="s16"></md-icon>
  25                     </md-button>
  26                 </div>
  27             </div>
  28             <div>
  29
  30                 <md-content ng-hide="vm.uploading || vm.stop">
  31                     <md-input-container class="md-icon-float md-block" ng-repeat="contactField in vm.contactFields">
  32                         <label>{{'CONTACTMANAGER.' + contactField.key | uppercase | translate}}</label>
  33                         <md-select name="{{contactField.key}}" ng-model="vm.binding[contactField.key]" placeholder="{{'CONTACTMANAGER.' + contactField.key | uppercase | translate}}" ng-required="contactField.required">
  34                             <md-option ng-value="field" ng-repeat="field in vm.fields">{{ field }}</md-option>
  35                             <md-option ng-value="null" ng-hide="contactField.required"><em>{{ 'CONTACTMANAGER.NONE' | translate }}</em></md-option>
  36                         </md-select>
  37                     </md-input-container>
  38
  39                     <md-input-container class="md-icon-float md-block">
  40                         <label translate="CONTACTMANAGER.LIST">List</label>
  41                         <md-select name="list" ng-model="vm.ListId" placeholder="Select a list" ng-change="vm.onChangeList()" required>
  42                             <md-option ng-value="list.id" ng-repeat="list in vm.lists.rows">{{list.name}}</md-option>
  43                         </md-select>
  44                     </md-input-container>
  45
  46                     <md-input-container class="md-icon-float md-block" ng-repeat="customField in vm.customFields.rows">
  47                         <label>{{customField.alias}}</label>
  48                         <md-select ng-model="vm.binding['cf_' + customField.id]" placeholder="{{customField.alias}}" ng-required="customField.required">
  49                             <md-option ng-value="field" ng-repeat="field in vm.fields">{{ field }}</md-option>
  50                             <md-option ng-value="null" ng-hide="customField.required"><em>{{ 'CONTACTMANAGER.NONE' | translate }}</em></md-option>
  51                         </md-select>
  52                     </md-input-container>
  53
  54                     <md-input-container class="md-icon-float md-block">
  55                         <label translate="CONTACTMANAGER.COMPANY">Company</label>
  56                         <md-select name="company" ng-model="vm.CompanyId" placeholder="Select a company">
  57                             <md-option ng-value="company.id" ng-repeat="company in vm.companies.rows">{{company.name}}</md-option>
  58                             <md-option ng-value="null"><em translate="CONTACTMANAGER.NONE">None</em></md-option>
  59                         </md-select>
  60                     </md-input-container>
  61
  62                     <md-input-container class="md-icon-float md-block">
  63                         <md-select ng-model="vm.duplicates" placeholder="{{ 'CONTACTMANAGER.CHECK_DUPLICATES' | translate}}" multiple>
  64                             <md-option ng-value="contactField.key" ng-repeat="contactField in vm.contactFields">{{ 'CONTACTMANAGER.' + contactField.key | uppercase | translate}}</md-option>
  65                         </md-select>
  66                     </md-input-container>
  67                 </md-content>
  68
  69                 <div layout="row" ng-if="vm.uploading || vm.stop">
  70                     <!-- WIDGET SUCCESS -->
  71                     <ms-widget class="h-140" flex>
  72                         <!-- Front -->
  73                         <ms-widget-front class="p-16 white-bg">
  74                             <div class="pt-8 pb-8" layout="column" layout-align="center center" flex>
  75                                 <div class="md-display-1 pb-8 green-fg">{{vm.successAmount}}</div>
  76                                 <div class="font-weight-500 secondary-text" translate="CONTACTMANAGER.SUCCESS">Success</div>
  77                             </div>
  78                         </ms-widget-front>
  79                         <!-- / Front -->
  80                     </ms-widget>
  81                     <!-- / WIDGET SUCCESS -->
  82
  83                     <!-- WIDGET FAILURE -->
  84                     <ms-widget class="h-140" flex>
  85                         <!-- Front -->
  86                         <ms-widget-front class="p-16 white-bg">
  87                             <div class="pt-8 pb-8" layout="column" layout-align="center center" flex>
  88                                 <div class="md-display-1 pb-8 red-fg">{{vm.failureAmount}}</div>
  89                                 <div class="font-weight-500 secondary-text" translate="CONTACTMANAGER.FAILURE">Failure</div>
  90                             </div>
  91                         </ms-widget-front>
  92                         <!-- / Front -->
  93                     </ms-widget>
  94                     <!-- / WIDGET FAILURE -->
  95
  96                     <!-- WIDGET DUPLICATES -->
  97                     <ms-widget class="h-140" flex ng-if="vm.duplicates.length">
  98                         <!-- Front -->
  99                         <ms-widget-front class="p-16 white-bg">
 100                             <div class="pt-8 pb-8" layout="column" layout-align="center center" flex>
 101                                 <div class="md-display-1 pb-8 orange-fg">{{vm.duplicatesAmount}}</div>
 102                                 <div class="font-weight-500 secondary-text" translate="CONTACTMANAGER.DUPLICATES">Duplicates</div>
 103                             </div>
 104                         </ms-widget-front>
 105                         <!-- / Front -->
 106                     </ms-widget>
 107                     <!-- / WIDGET DUPLICATES -->
 108                 </div>
 109             </div>
 110         </md-dialog-content>
 111
 112         <md-dialog-actions layout="row" layout-align="space-between center">
 113             <div layout="row">
 114                 <md-button aria-label="SAVE" ng-disabled="uploadForm.$invalid || uploadForm.$pristine || vm.uploading || vm.stop" ng-click="vm.upload()" class="md-accent md-raised" aria-label="UPLOAD" translate="CONTACTMANAGER.UPLOAD" translate-attr-aria-label="CONTACTMANAGER.UPLOAD">
 115                     UPLOAD
 116                 </md-button>
 117             </div>
 118         </md-dialog-actions>
 119     </form>
 120 </md-dialog>