@kigi/components 1.5.10-beta.4 → 1.5.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kigi/components",
-  "version": "1.5.10-beta.4",
+  "version": "1.5.11",
   "description": "@kigi/components",
   "main": "src/components/index.ts",
   "scripts": {
@@ -38,7 +38,6 @@
     "@syncfusion/ej2-navigations": "^17.4.43",
     "@syncfusion/ej2-splitbuttons": "^17.4.43",
     "@types/node": "^10.10.1",
-    "ace-builds": "1.3.3",
     "angular": "1.7.9",
     "angular-animate": "^1.7.9",
     "angular-bootstrap": "^0.12.2",
@@ -51,10 +50,9 @@
     "angular-ui-bootstrap": "^2.5.6",
     "angular-vs-repeat": "^2.0.14",
     "cep-promise": "^3.0.3",
-    "cropperjs": "^1.5.12",
     "croppie": "^2.6.2",
     "detect-browser": "^3.0.1",
-    "firebase": "7.16.0",
+    "firebase": "^7.16.0",
     "fuse.js": "^3.4.6",
     "grpc": "1.20.2",
     "highcharts": "^6.1.0",
@@ -73,7 +71,8 @@
     "progressbar.js": "^1.0.1",
     "raphael": "^2.2.8",
     "sugarss": "^2.0.0",
-    "webcamjs": "^1.0.25"
+    "webcamjs": "^1.0.25",
+    "ace-builds": "1.3.3"
   },
   "devDependencies": {
     "@types/angular": "^1.6.27",

package/src/components/index.ts

@@ -84,7 +84,6 @@ import { mbgTextEditorModule } from './mbg-text-editor'
 import 'jodit/src/langs/pt_br.js'
 import { NgMaskIe } from '../helpers/ie-directive/ie-directive'
 import { mbgAceEditorModule } from './mbg-ace-editor'
-import { mbgImageUploadCropModule } from './mbg-image-upload-crop'
 
 if (!window['$']) {
   window['$'] = $
@@ -101,7 +100,6 @@ const mbgComponentsModule = angular
     ngSanitize,
     ngAnimate,
     mbgImageUploadModule,
-    mbgImageUploadCropModule,
     mbgInputCnpjModule,
     mbgInputCpfModule,
     mbgInputCpfCnpjModule,

package/src/components/mbg-image-upload/helpers/firebase.ts

@@ -2,90 +2,66 @@ import firebase from 'firebase/app'
 import 'firebase/storage'
 
 export namespace ImageUploadFirebase {
-  const URL_FIREBASE = 'https://firebasestorage.googleapis.com/v0/b/bucket/o/id?alt=media'
+    const URL_FIREBASE = 'https://firebasestorage.googleapis.com/v0/b/bucket/o/id?alt=media'
 
-  export function getStorage(): any {
-    return window['firebase'] ? window['firebase'].storage() : firebase.storage()
-  }
+    export function getStorage(): any {
+        return window['firebase'] ? window['firebase'].storage() : firebase.storage()
+    }
 
-  export function guid() {
-    const s4 = () =>
-      Math.floor((1 + Math.random()) * 0x10000)
-        .toString(16)
-        .substring(1)
-    return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4()
-  }
+    export function guid() {
+        const s4 = () => Math.floor((1 + Math.random()) * 0x10000)
+            .toString(16)
+            .substring(1)
+        return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4()
+    }
 
-  export async function removeFiles(files) {
-    files.forEach((file) => {
-      if (file) {
-        const storageRef = getStorage().ref().child(file.idStorage)
-        storageRef.delete()
-      }
-    })
-  }
+    export async function removeFiles(files) {
+        files.forEach((file) => {
+            if (file) {
+                const storageRef = getStorage().ref().child(file.idStorage)
+                storageRef.delete()
+            }
+        })
+    }
 
-  export async function upload(files: Array<string>, folder = '') {
-    return await Promise.all(
-      files.map(async (base64) => {
+    export async function upload(files: Array<string>, folder = '') {
+        return await Promise.all(files.map(async (base64) => {
+            const imageID = this.guid()
+            const storageRef = getStorage().ref().child(folder ? `${folder}/${imageID}` : imageID)
+            const response = await storageRef.putString(base64, 'data_url')
+            const imageURL = folder ? URL_FIREBASE.replace(/bucket/g, response.metadata.bucket).replace(/id/g, `${folder}%2F${response.metadata.name}`)
+                : URL_FIREBASE.replace(/bucket/g, response.metadata.bucket).replace(/id/g, response.metadata.name)
+            const image = { url: imageURL, idStorage: imageID }
+            return image
+        }))
+    }
+    export function uploadFile(file: File, config: { onProgress, onPause, onResume, onError, onSuccess }, folder = '') {
         const imageID = this.guid()
-        const storageRef = getStorage()
-          .ref()
-          .child(folder ? `${folder}/${imageID}` : imageID)
-        const response = await storageRef.putString(base64, 'data_url')
-        const imageURL = folder
-          ? URL_FIREBASE.replace(/bucket/g, response.metadata.bucket).replace(
-              /id/g,
-              `${folder}%2F${response.metadata.name}`,
-            )
-          : URL_FIREBASE.replace(/bucket/g, response.metadata.bucket).replace(
-              /id/g,
-              response.metadata.name,
-            )
-        const image = { url: imageURL, idStorage: imageID }
-        return image
-      }),
-    )
-  }
-  export function uploadFile(
-    file: File,
-    config: { onProgress; onPause; onResume; onError; onSuccess },
-    folder = '',
-  ) {
-    const imageID = this.guid()
-    const storageRef = getStorage()
-      .ref()
-      .child(folder ? `${folder}/${imageID}` : imageID)
-    const uploadTask = storageRef.put(file)
+        const storageRef = getStorage().ref().child(folder ? `${folder}/${imageID}` : imageID)
+        const uploadTask = storageRef.put(file)
 
-    uploadTask.on(
-      'state_changed',
-      (snapshot) => {
-        const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100
-        config.onProgress(progress)
-        switch (snapshot.state) {
-          case firebase.storage.TaskState.PAUSED:
-            config.onPause()
-            break
-          case firebase.storage.TaskState.RUNNING:
-            config.onResume()
-            break
-        }
-      },
-      (e) => {
-        config.onError()
-      },
-      () => {
-        uploadTask.snapshot.ref
-          .getDownloadURL()
-          .then((downloadURL) => {
-            config.onSuccess({ fileName: file.name, fileURL: downloadURL, fileSize: file.size })
-          })
-          .catch(() => {
+        uploadTask.on('state_changed', (snapshot) => {
+            const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100
+            config.onProgress(progress)
+            switch (snapshot.state) {
+                case firebase.storage.TaskState.PAUSED:
+                    config.onPause()
+                    break
+                case firebase.storage.TaskState.RUNNING:
+                    config.onResume()
+                    break
+            }
+        }, (e) => {
             config.onError()
-          })
-      },
-    )
-    return uploadTask
-  }
+        }, () => {
+            uploadTask.snapshot.ref.getDownloadURL()
+                .then((downloadURL) => {
+                    config.onSuccess({ fileName: file.name, fileURL: downloadURL, fileSize: file.size })
+                })
+                .catch(() => {
+                    config.onError()
+                })
+        })
+        return uploadTask
+    }
 }

package/src/components/mbg-select-multi-list/mbg-select-multi-list.ts

@@ -112,6 +112,8 @@ export class MbgSelectMultiListController {
 
   searchNgModel() {
     this.$timeout(() => {
+      const search = (this.label || '').split(',')
+      const keys = search.map((word) => word.trim())
       const dataModel = JSON.parse(JSON.stringify(this.ngModel))
       const options = {
         shouldSort: true,
@@ -120,7 +122,7 @@ export class MbgSelectMultiListController {
         distance: 100,
         maxPatternLength: 32,
         minMatchCharLength: 1,
-        keys: [this.label],
+        keys,
       }
       const fuse = new Fuse(dataModel, options)
       const result = fuse.search(this.inputValueResult)

package/src/index.html

@@ -982,8 +982,7 @@
   {{teste}}
   </div> -->
   <div style="padding: 100px">
-
-    <!-- <div class="panel panel-default">
+    <div class="panel panel-default">
       <div class="panel-heading">Ace Editor</div>
       <div class="panel-body">
         <mbg-ace-editor ng-model="aceEditor"
@@ -1000,14 +999,8 @@
         <mbg-input-text ng-model="asdasdasd"
                         ng-change="hhhsss($event)"></mbg-input-text>
       </div>
-    </div> -->
-
-    <div>
-      <mbg-image-upload-crop ng-model="imgCrop"
-                             config="configImgCrop"></mbg-image-upload-crop>
     </div>
 
-
   </div>
 </body>
 

package/src/index.ts

@@ -2,8 +2,7 @@
 
 import * as angular from 'angular'
 import components from './components'
-import * as firebase from 'firebase'
-import 'firebase/firestore'
+import { initializeApp } from 'firebase/app'
 import './assets/angular-locale_pt-br.js'
 import * as dataDocument from './assets/data-default.json'
 import { MbgAlert } from './helpers/services/mbg-alert'
@@ -14,7 +13,7 @@ const sizeJson = require('./json/sizes.json')
 const genderJson = require('./json/gender.json')
 const mockData = require('./json/MOCK_DATA.json')
 
-firebase.initializeApp({
+initializeApp({
   apiKey: 'AIzaSyB0aH7e6XjWJ-xViji3CuXHBbLuWRALC78',
   authDomain: 'app-kigi.firebaseapp.com',
   databaseURL: 'https://app-kigi-default-rtdb.firebaseio.com',
@@ -31,17 +30,6 @@ const module = angular.module('demo', ['ngLocale', components]).controller('demo
   '$http',
   'mbgAlert',
   ($scope, $timeout, $http, mbgAlert: MbgAlert) => {
-    $scope.imgCrop = 'https://i.pinimg.com/originals/c3/a5/b3/c3a5b332f9716abb1c67da38a12595e8.jpg'
-    $scope.configImgCrop = {
-      aspectRatio: 16 / 9,
-      minCropBoxWidth: 200,
-      minCropBoxHeight: 100,
-      minCanvasHeight: 200,
-      minContainerHeight: 100,
-      height: '124px',
-      // width: '300px',
-    }
-
     $scope.configDocument = {
       document: dataDocument,
       preview: true,

package/src/components/mbg-image-upload-crop/image-upload-crop.html

@@ -1,24 +0,0 @@
-<div class="image-upload-crop-wrapper"
-     ng-style="{ 'width': $ctrl.config.width ? $ctrl.config.width : '200px', 'height': $ctrl.config.height ? $ctrl.config.height : '84px'}">
-     <div class="upload-item"
-          ng-style="{'cursor': $ctrl.ngModel ? 'default' : 'pointer'}"
-          ng-click="!$ctrl.ngModel && $ctrl.openModal()">
-          <div class="preview-image-crop"
-               ng-show="$ctrl.ngModel"
-               ng-click="$ctrl.openModal()">
-               <img ng-show="$ctrl.ngModel"
-                    ng-style="{ 'object-fit': 'contain', 'width': '100%'}"
-                    src="{{$ctrl.ngModel}}">
-          </div>
-          <div class="icon-upload-image-crop">
-               <i ng-show="!$ctrl.ngModel"
-                  class="fas fa-cloud-upload-alt"></i>
-               <div class="buttons"
-                    ng-class="{'remove': $ctrl.ngModel}">
-                    <a ng-click="$ctrl.removeImage($event)">{{$ctrl.ngModel ? 'Remover' : ''}}</a>
-                    <a ng-click="$ctrl.openModal()">{{$ctrl.ngModel ? 'Alterar' : 'Fazer upload'}}</a>
-               </div>
-          </div>
-
-     </div>
-</div>

package/src/components/mbg-image-upload-crop/image-upload-crop.scss

@@ -1,76 +0,0 @@
-.image-upload-crop-wrapper {
-    .upload-item {
-        padding: 4px;
-        border: 1px dashed #9c9c9c;
-        border-radius: 4px;
-        display: flex;
-        flex-direction: column;
-        width: 100%;
-        transition: all 300ms ease-in-out;
-        height: 100%;
-        margin-top: 10px;
-        position: relative;
-        text-align: center;
-        align-items: center;
-        justify-content: center;
-
-        i {
-            font-size: 24px;
-            margin-top: 4px;
-            margin-bottom: 4px;
-            color: #4d4d4d;
-        }
-
-        label {
-            position: absolute;
-            top: -17px;
-            left: 0;
-            font-weight: 500;
-            font-size: 12px;
-        }
-
-        a {
-            text-align: center;
-            font-size: 12px;
-            margin-top: 2px;
-        }
-
-        .preview-image-crop {
-            height: calc(100% - 24px);
-            cursor: pointer;
-
-            img {
-                width: auto;
-                height: 100%;
-            }
-        }
-
-        .icon-upload-image-crop {
-            width: 100%;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-            align-items: center;
-
-            .buttons {
-                width: 100%;
-                display: flex;
-                justify-content: center;
-
-                a {
-                    cursor: pointer;
-                }
-            }
-
-            .remove {
-                justify-content: space-around;
-            }
-        }
-        &:hover {
-            background: #e4e4e4;
-        }
-    }
-    .gap-12 {
-        gap: 12px;
-    }
-}

package/src/components/mbg-image-upload-crop/image-upload-crop.ts

@@ -1,50 +0,0 @@
-import './image-upload-crop.scss'
-import template from './image-upload-crop.html'
-import { IConfigImageUploadCrop } from './interfaces/config-image-upload-crop.interface'
-import { UploadImageCropModal } from './modals/upload-image-crop-modal'
-
-class ImageUploadCropController {
-  public config: IConfigImageUploadCrop
-  public ngModel: string
-
-  constructor(
-    public $scope,
-    public $element,
-    public $timeout,
-    public uploadImageCropModal: UploadImageCropModal,
-  ) {}
-
-  $onInit() {
-    this.config = this.config || {
-      aspectRatio: 1 / 1,
-      minCropBoxWidth: 200,
-      minCropBoxHeight: 200,
-      minCanvasHeight: 100,
-      minContainerHeight: 100,
-    }
-  }
-
-  removeImage(e) {
-    e.stopPropagation()
-    this.ngModel = ''
-  }
-
-  openModal() {
-    this.uploadImageCropModal.open(this.config, this.ngModel).then((url) => {
-      if (url) {
-        this.ngModel = url
-      }
-    })
-  }
-}
-
-const imageUploadCrop = {
-  bindings: {
-    ngModel: '=?',
-    config: '=?',
-  },
-  controller: ImageUploadCropController,
-  template,
-}
-
-export { imageUploadCrop }

package/src/components/mbg-image-upload-crop/index.ts

@@ -1,9 +0,0 @@
-import * as angular from 'angular'
-import { imageUploadCrop } from './image-upload-crop'
-import { uploadImageCropModalModule } from './modals/upload-image-crop-modal'
-
-const mbgImageUploadCropModule = angular
-  .module('mbg.components.imageUploadCrop', [uploadImageCropModalModule])
-  .component('mbgImageUploadCrop', imageUploadCrop).name
-
-export { mbgImageUploadCropModule }

package/src/components/mbg-image-upload-crop/interfaces/config-image-upload-crop.interface.ts

@@ -1,9 +0,0 @@
-export interface IConfigImageUploadCrop {
-  aspectRatio: number
-  minCropBoxWidth: number
-  minCropBoxHeight: number
-  minCanvasHeight: number
-  minContainerHeight: number
-  width?: string
-  height?: string
-}

package/src/components/mbg-image-upload-crop/modals/upload-image-crop-modal/index.ts

@@ -1,31 +0,0 @@
-import * as angular from 'angular'
-import './upload-image-crop-modal.scss'
-import { UploadImageCropModalController } from './upload-image-crop-modal'
-import UploadImageCropModalTemplate from './upload-image-crop-modal.html'
-import { IConfigImageUploadCrop } from '../../interfaces/config-image-upload-crop.interface'
-
-export class UploadImageCropModal {
-  constructor(public $uibModal) {}
-
-  open(cropOptions: IConfigImageUploadCrop, image: string) {
-    const modalInstance = this.$uibModal.open({
-      template: UploadImageCropModalTemplate,
-      controller: UploadImageCropModalController,
-      controllerAs: '$ctrl',
-      animation: true,
-      backdrop: 'static',
-      size: 'md',
-      resolve: {
-        cropOptions: () => cropOptions,
-        image: () => image,
-      },
-    })
-    return modalInstance.result
-  }
-}
-
-const uploadImageCropModalModule = angular
-  .module(`mbg.modals.uploadImageCropModal`, [])
-  .service('uploadImageCropModal', UploadImageCropModal).name
-
-export { uploadImageCropModalModule }

package/src/components/mbg-image-upload-crop/modals/upload-image-crop-modal/upload-image-crop-modal.html

@@ -1,70 +0,0 @@
-<div class="upload-image-crop-modal-wrapper">
-  <div class="head-logo">
-    <h1>Imagem</h1>
-
-  </div>
-  <div class="body-logo">
-    <div class="image-container-crop">
-      <input type="file"
-             multiple="false"
-             onchange="angular.element(this).scope().$ctrl.onSelectFiles(event)"
-             id="chooseFileLogo" />
-
-      <div ng-show="!$ctrl.file"
-           ng-click="$ctrl.chooseFileLogo()"
-           ondrop="angular.element(this).scope().$ctrl.onDropFile(event)"
-           ondragover="angular.element(this).scope().$ctrl.onDragOver(event)"
-           class="flex flex-column justify-center align-center image-drap-drop-container">
-        <div class="flex flex-column align-center justify-center">
-          <i ng-show="!$ctrl.image"
-             class="fas fa-cloud-upload-alt"></i>
-          <label ng-show="$ctrl.image"
-                 style="font-weight: 500;">Imagem atual</label>
-          <img ng-if="$ctrl.image"
-               style="max-height: 200px;max-width: 400px; object-fit: contain;"
-               class="m-b-24"
-               src="{{$ctrl.image}}"></i>
-
-          <label ng-show="$ctrl.image">Arraste e solte uma imagem ou clique aqui para editar</label>
-          <label ng-show="!$ctrl.image">Arraste e solte uma imagem ou clique aqui para adicionar</label>
-        </div>
-      </div>
-      <div class="relative-content"
-           ng-if="$ctrl.file">
-        <button type="button"
-                class="stop-upload"
-                ng-click="$ctrl.resetFile()">
-          <i class="fas fa-times"></i>
-        </button>
-        <img ng-src="{{ $ctrl.file }}"
-             class="crop-image-original"
-             ng-init="$ctrl.createCropier()"
-             alt="Logo" />
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-md-12">
-        <p style="margin-bottom: 0px">Tamanho ideal em pixels: ({{$ctrl.cropOptions.minCropBoxWidth}} x
-          {{$ctrl.cropOptions.minCropBoxHeight}})px
-        </p>
-      </div>
-    </div>
-    <div class="row m-t-24">
-      <div class="col-md-12 flex flex-column align-center justify-center">
-        <mbg-btn-form ng-click="$ctrl.save()"
-                      ng-disabled="$ctrl.loading"
-                      loading="$ctrl.loading"
-                      label="Confirmar"></mbg-btn-form>
-        <label class="error-label"
-               ng-class="{'active': $ctrl.activeError}">{{$ctrl.labelError}}</label>
-        <div class="flex align-center">
-          <a class="cancel-link"
-             target="_self"
-             ng-disabled="$ctrl.loading"
-             ng-click="$ctrl.closeModal()">Cancelar</a>
-        </div>
-      </div>
-    </div>
-
-  </div>
-</div>

package/src/components/mbg-image-upload-crop/modals/upload-image-crop-modal/upload-image-crop-modal.scss

@@ -1,140 +0,0 @@
-.upload-image-crop-modal-wrapper {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-
-  .relative-content {
-    position: relative;
-    max-height: 400px;
-
-    .stop-upload {
-      z-index: 1000;
-      position: absolute;
-      top: 4px;
-      right: 4px;
-      background: #fff;
-      border-radius: 50%;
-      font-size: 21px;
-      width: 34px;
-      height: 34px;
-      border: 2px solid #595959;
-      color: #666;
-      transform: scale(0.8);
-      transition: all 300ms ease;
-
-      &:hover {
-        transform: scale(0.9);
-      }
-    }
-  }
-
-  .cropper-container {
-    width: 100% !important;
-    height: 368px !important;
-  }
-
-  .head-logo {
-    padding: 0 24px;
-    h1 {
-      color: var(--neutral1);
-      font-size: 24px;
-    }
-  }
-  .body-logo {
-    flex: 1;
-    position: relative;
-    padding: 0 24px;
-    padding-bottom: 24px;
-  }
-  .image-container-crop {
-    width: 100%;
-    background: #f5f5f5;
-    height: 368px;
-    border-radius: 5px;
-    overflow: hidden;
-    cursor: pointer;
-  }
-  #chooseFileLogo {
-    display: none;
-  }
-  .crop-image-original {
-    display: block;
-    max-width: 100%;
-  }
-  .image-drap-drop-container {
-    height: 100%;
-
-    i {
-      font-size: 68px;
-      color: #666;
-    }
-    label {
-      font-size: 16px;
-      margin: 14px 4px;
-      cursor: pointer;
-    }
-    button {
-      margin-top: 18px;
-      height: 44px;
-      padding: 0 24px;
-      border-radius: 41px;
-      background: var(--contrast);
-      color: #fff;
-      border: none;
-    }
-  }
-
-  .flex {
-    display: flex;
-    .flex-1 {
-      flex: 1;
-    }
-    .fit-content {
-      min-height: fit-content;
-    }
-    &.flex-row {
-      flex-direction: row;
-    }
-    &.flex-column {
-      flex-direction: column;
-    }
-    &.align-center {
-      align-items: center;
-    }
-    &.align-end {
-      align-items: flex-end;
-    }
-    &.align-start {
-      align-items: flex-start;
-    }
-    &.align-between {
-      align-items: space-between;
-    }
-    &.justify-center {
-      justify-content: center;
-    }
-    &.justify-end {
-      justify-content: flex-end;
-    }
-    &.justify-start {
-      justify-content: flex-start;
-    }
-    &.justify-between {
-      justify-content: space-between;
-    }
-    &.justify-around {
-      justify-content: space-around;
-    }
-    &.wrap {
-      flex-wrap: wrap;
-    }
-  }
-  .m-t-24 {
-    margin-top: 24px;
-  }
-  .cancel-link {
-    margin: 18px 24px 0px 24px;
-    color: var(--neutral2);
-    cursor: pointer;
-  }
-}

package/src/components/mbg-image-upload-crop/modals/upload-image-crop-modal/upload-image-crop-modal.ts

@@ -1,151 +0,0 @@
-// import { MobiEVendiService } from 'modules/mobi-store/services/mobi-e-vendi-service'
-import 'cropperjs/dist/cropper.css'
-// import Cropper from 'cropperjs'
-import Cropper from 'cropperjs/dist/cropper.esm'
-import { UtilMbgFunctions } from '../../../../helpers/util-mbg-functions'
-import { UtilUID } from '../../../../helpers/util-uid'
-import { MbgImageUploadService } from '../../../mbg-image-upload/services/mbg-image-upload-service'
-import firebase from 'firebase/app'
-import 'firebase/storage'
-// import { UtilUID } from 'modules/helpers/namespaces/util-uid'
-// import { SessionStorage } from 'modules/helpers/namespaces/sessionstorage'
-// import { HelperNotificationService } from 'modules/helpers/services/notification.service'
-
-class UploadImageCropModalController {
-  private file
-  private cropper: Cropper
-  private loading
-  private activeError: boolean
-  private labelError: string
-
-  constructor(
-    public $timeout,
-    public $scope,
-    public $uibModalInstance,
-    public cropOptions,
-    public image,
-    public mbgImageUploadService: MbgImageUploadService,
-  ) {}
-
-  $onInit() {
-    this.$scope.$on('$destroy', () => {
-      this.destroyCropier()
-    })
-  }
-
-  closeModal() {
-    this.$uibModalInstance.close()
-  }
-
-  async onFileSelect(file) {
-    const base64 = await this.toBase64(file)
-    this.$timeout(() => {
-      this.file = base64
-    })
-  }
-
-  createCropier() {
-    this.$timeout(() => {
-      const image: any = document.querySelector('.crop-image-original')
-      this.cropper = new Cropper(
-        image,
-        Object.assign(
-          {
-            dragMode: 'move',
-          },
-          this.cropOptions,
-        ),
-      )
-    })
-  }
-
-  toBase64 = (file) => {
-    return new Promise((resolve, reject) => {
-      const reader = new FileReader()
-      reader.readAsDataURL(file)
-      reader.onload = () => resolve(reader.result)
-      reader.onerror = (error) => reject(error)
-    })
-  }
-
-  onDropFile(ev) {
-    ev.preventDefault()
-    const dataTransfer = ev.dataTransfer
-    if (dataTransfer.files && dataTransfer.files.length > 0) {
-      const file = dataTransfer.files[0]
-      this.onFileSelect(file)
-    }
-  }
-
-  onDragOver(ev) {
-    ev.preventDefault()
-    ev.dataTransfer.dropEffect = 'move'
-  }
-
-  chooseFileLogo() {
-    const input: any = document.querySelector('#chooseFileLogo')
-    input.value = ''
-    input.click()
-  }
-
-  resetFile() {
-    this.file = null
-    const input: any = document.querySelector('#chooseFileLogo')
-    input.value = ''
-    this.destroyCropier()
-  }
-
-  onSelectFiles(ev) {
-    const files = ev.target.files
-    if (files && files.length > 0) {
-      this.onFileSelect(files[0])
-    }
-  }
-
-  destroyCropier() {
-    if (this.cropper) {
-      this.cropper.destroy()
-    }
-  }
-
-  dismiss() {
-    this.$uibModalInstance.close(false)
-  }
-
-  async save() {
-    try {
-      this.loading = true
-      this.activeError = false
-      const URL_FIREBASE = 'https://firebasestorage.googleapis.com/v0/b/bucket/o/id?alt=media'
-      const base64 = this.cropper.getCroppedCanvas().toDataURL()
-      const imageID = UtilUID.generete()
-
-      const storageRef = (window['firebase'] ? window['firebase'].storage() : firebase.storage())
-        .ref()
-        .child(imageID)
-      const response = await storageRef.putString(base64, 'data_url')
-      const imageURL = URL_FIREBASE.replace(/bucket/g, response.metadata.bucket).replace(
-        /id/g,
-        response.metadata.name,
-      )
-
-      this.$uibModalInstance.close(imageURL)
-    } catch (e) {
-      console.log(e)
-      this.loading = false
-      this.activeError = true
-      this.labelError = 'Erro ao salvar a imagem, tente novamente!'
-    }
-  }
-}
-
-UploadImageCropModalController[`$inject`] = [
-  '$timeout',
-  '$scope',
-  '$uibModalInstance',
-  'cropOptions',
-  'image',
-  'mbgImageUploadService',
-]
-
-export { UploadImageCropModalController }