@kigi/components 1.37.0 → 1.38.0-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kigi/components",
-  "version": "1.37.0",
+  "version": "1.38.0-beta.2",
   "description": "@kigi/components",
   "main": "src/components/index.ts",
   "scripts": {
@@ -57,7 +57,8 @@
     "firebase": "7.16.0",
     "fuse.js": "^3.4.6",
     "grpc": "1.20.2",
-    "highcharts": "^6.1.0",
+    "highcharts": "^6.2.0",
+    "highcharts-more": "^0.1.7",
     "imports-loader": "^0.8.0",
     "jodit": "^3.6.11",
     "jquery": "3.4.1",
@@ -65,6 +66,7 @@
     "jquery-ui": "^1.12.1",
     "jquery-ui-bundle": "^1.12.1-migrate",
     "lodash.get": "^4.4.2",
+    "moment": "^2.30.1",
     "ng-easy-infinite-scroll": "^1.0.0",
     "postcss-flexbugs-fixes": "^4.1.0",
     "postcss-import": "^12.0.1",

package/src/components/index.ts

@@ -76,7 +76,6 @@ import { mbgSelectMultiListModule } from './mbg-select-multi-list'
 import { mbgProductInlineModule } from './mbg-product-inline'
 import { NgCountCharacter } from '../helpers/count-character/count-character'
 import { mbgPopupSelectModule } from './mbg-popup-select'
-import { mbgStatusLabelModule } from './mbg-status-label'
 import { mbgDynamicCubeModule } from './mbg-dynamic-cube'
 import { mbgTimelineModule } from './mbg-timeline'
 import { MbgActiveScroll } from '../helpers/mbg-active-scroll/mbg-active-scroll'
@@ -86,6 +85,8 @@ 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'
+import { mbgStoreGoalModule } from './mbg-store-goal'
+import { mbgStatusLabelModule } from './mbg-status-label'
 
 if (!window['$']) {
   window['$'] = $
@@ -147,12 +148,13 @@ const mbgComponentsModule = angular
     mbgProductInlineModule,
     // mbgEditorModule,
     mbgPopupSelectModule,
-    mbgStatusLabelModule,
     mbgDynamicCubeModule,
     mbgTimelineModule,
     mbgRepasseModule,
     mbgTextEditorModule,
     mbgAceEditorModule,
+    mbgStoreGoalModule,
+    mbgStatusLabelModule,
   ])
   .config(appConfig)
   .service('mbgAlert', MbgAlert)

package/src/components/mbg-homescreen/cards/chart-wrapper/chart-wrapper.html

@@ -2,11 +2,12 @@
     <div class="home-chart"> </div>
     <div class="divider"></div>
     <div class="home-cards">
-        <mbg-card-panel ng-repeat="panel in $ctrl.panels"
+        <mbg-card-panel ng-repeat="panel in $ctrl.panels track by $index"
                         loading="$ctrl.loading"
                         allow-dashboard-main-sales="$ctrl.allowDashboardMainSales"
                         display-values="$ctrl.displayValues"
                         allowed-to-see="$ctrl.allowedToSee"
+                        active-filter="$ctrl.activeFilter"
                         panel-values-filter="$ctrl.panelValuesFilter"
                         allowed-call-back="$ctrl.allowedCallBack()"
                         panel="panel">

package/src/components/mbg-homescreen/cards/chart-wrapper/chart-wrapper.ts

@@ -15,6 +15,7 @@ const mbgChartWrapper = {
     allowedToSee: '=?',
     allowedCallBack: '&?',
     allowDashboardMainSales: '=?',
+    activeFilter: '=?',
     panelValuesFilter: '=?',
   },
   template,

package/src/components/mbg-homescreen/cards/panel/panel.scss

@@ -9,6 +9,8 @@ mbg-card-panel {
     width: 100%;
     height: 100%;
     margin-right: 200px;
+    border-radius: 10px;
+    opacity: 1.0;
 }
 
   .tooltip-inner {
@@ -16,7 +18,9 @@ mbg-card-panel {
     margin-right: 180px;
    }
   .mbg-h-c-panel {
-    border: 1px solid #5f5b5b;
+    border: 1px solid #f8f8f1;
+    border-radius: 12px;
+    padding: 8px;
     border-radius: 12px;
     padding: 8px;
 

package/src/components/mbg-homescreen/cards/panel/panel.ts

@@ -102,6 +102,13 @@ class MbgCardPanelController {
     }, 1000)
   }
 
+  formatToBRL(value) {
+    return value.toLocaleString('pt-BR', {
+      style: 'currency',
+      currency: 'BRL',
+    })
+  }
+
   syncValue() {
     if (this.panel.sync) {
       this.panel.loading = true
@@ -138,6 +145,7 @@ const mbgCardPanel = {
     allowedToSee: '=?',
     allowedCallBack: '&?',
     allowDashboardMainSales: '=?',
+    activeFilter: '=?',
     panelValuesFilter: '=?',
   },
   template,

package/src/components/mbg-homescreen/charts/bar-line/bar-line.html

@@ -5,6 +5,7 @@
                        allow-dashboard-main-sales="$ctrl.allowDashboardMainSales"
                        display-values="$ctrl.displayValues"
                        allowed-to-see="$ctrl.allowedToSee"
+                       active-filter="$ctrl.activeFilter"
                        panel-values-filter="$ctrl.panelValuesFilter"
                        allowed-call-back="$ctrl.allowedCallBack()"></mbg-chart-wrapper>
 

package/src/components/mbg-homescreen/charts/bar-line/bar-line.ts

@@ -257,6 +257,7 @@ const mbgChartBarLine = {
     allowedToSee: '=?',
     allowedCallBack: '&?',
     allowDashboardMainSales: '=?',
+    activeFilter: '=?',
     panelValuesFilter: '=?',
   },
   template,

package/src/components/mbg-homescreen/charts/bar-line-pie/bar-line-pie.html

@@ -5,6 +5,7 @@
                        display-values="$ctrl.displayValues"
                        allow-dashboard-main-sales="$ctrl.allowDashboardMainSales"
                        allowed-to-see="$ctrl.allowedToSee"
+                       active-filter="$ctrl.activeFilter"
                        panel-values-filter="$ctrl.panelValuesFilter"
                        allowed-call-back="$ctrl.allowedCallBack()"></mbg-chart-wrapper>
 

package/src/components/mbg-homescreen/charts/bar-line-pie/bar-line-pie.ts

@@ -282,6 +282,7 @@ const mbgChartBarLinePie = {
     allowedToSee: '=?',
     allowedCallBack: '&?',
     allowDashboardMainSales: '=?',
+    activeFilter: '=?',
     panelValuesFilter: '=?',
   },
   template,

package/src/components/mbg-homescreen/charts/line/line.html

@@ -5,6 +5,7 @@
                        display-values="$ctrl.displayValues"
                        allow-dashboard-main-sales="$ctrl.allowDashboardMainSales"
                        allowed-to-see="$ctrl.allowedToSee"
+                       active-filter="$ctrl.activeFilter"
                        panel-values-filter="$ctrl.panelValuesFilter"
                        allowed-call-back="$ctrl.allowedCallBack()"></mbg-chart-wrapper>
 

package/src/components/mbg-homescreen/charts/line/line.ts

@@ -278,6 +278,7 @@ const mbgChartLine = {
     allowedToSee: '=?',
     allowedCallBack: '&?',
     allowDashboardMainSales: '=?',
+    activeFilter: '=?',
     panelValuesFilter: '=?',
   },
   template,

package/src/components/mbg-homescreen/index.ts

@@ -14,3 +14,4 @@ const mbgHomeScreenModule = angular
   .component('mbgChartWrapper', mbgChartWrapper).name
 
 export { mbgHomeScreenModule }
+

package/src/components/mbg-homescreen/mbg-homescreen.html

@@ -52,6 +52,7 @@
                     loading="$ctrl.loading"
                     allowed-to-see="$ctrl.allowedToSee"
                     allowed-call-back="$ctrl.allowedCallBack()"
+                    active-filter="$ctrl.activeFilter"
                     panel-values-filter="$ctrl.panelValuesFilter"
                     ng-if="$ctrl.chart && $ctrl.chart.type == 'line'"></mbg-chart-line>
     <mbg-chart-bar-line chart="$ctrl.chart"
@@ -61,6 +62,7 @@
                         loading="$ctrl.loading"
                         allowed-to-see="$ctrl.allowedToSee"
                         allowed-call-back="$ctrl.allowedCallBack()"
+                        active-filter="$ctrl.activeFilter"
                         panel-values-filter="$ctrl.panelValuesFilter"
                         ng-if="$ctrl.chart && $ctrl.chart.type == 'barline'"></mbg-chart-bar-line>
     <mbg-chart-bar-line-pie chart="$ctrl.chart"
@@ -70,6 +72,7 @@
                             loading="$ctrl.loading"
                             allowed-to-see="$ctrl.allowedToSee"
                             allowed-call-back="$ctrl.allowedCallBack()"
+                            active-filter="$ctrl.activeFilter"
                             panel-values-filter="$ctrl.panelValuesFilter"
                             ng-if="$ctrl.chart && $ctrl.chart.type == 'barlinepie'"></mbg-chart-bar-line-pie>
     <div class="display-values">

package/src/components/mbg-homescreen/mbg-homescreen.ts

@@ -22,6 +22,7 @@ class MbgHomescreenController {
     isCurrency: boolean
   }[]
   private allowDashboardMainSales
+  private filterActive
 
   constructor(public $scope, public $element, public $attrs, public $timeout) {}
 
@@ -63,6 +64,7 @@ class MbgHomescreenController {
         return tab
       })
       this.activeFilter = item
+      this.filterActive = this.activeFilter
       item.active = true
       if (this.tabs[this.activeIndex].executeFilter) {
         this.tabs[this.activeIndex].executeFilter(this.config)
@@ -78,6 +80,7 @@ class MbgHomescreenController {
         this.tabs.forEach((tab, index) => (this.tabs[index].active = false))
         this.tabs[tabIndex].active = true
         this.activeFilter = (this.tabs[tabIndex].filters || []).find((filter) => filter.active)
+        this.filterActive = this.activeFilter
         this.cards = this.tabs[tabIndex].cards
         this.chart = this.tabs[tabIndex].chart
       }

package/src/components/mbg-store-goal/index.ts

@@ -0,0 +1,8 @@
+import * as angular from 'angular'
+import { mbgStoreGoal } from './mbg-store-goal'
+
+const mbgStoreGoalModule = angular
+  .module('mbg.components.mbgStoreGoal', [])
+  .component('mbgStoreGoal', mbgStoreGoal).name
+
+export { mbgStoreGoalModule }

package/src/components/mbg-store-goal/mbg-store-goal.html

@@ -0,0 +1,65 @@
+<div ng-class="{'opacity-dash-goal': !$ctrl.isPermissionStoreGoal}"
+     class="store-goal-wrapper"
+     ng-show="$ctrl.showDashboard">
+   <div class="description-container-dash">
+      <p class="description-dash">
+         <i class="fa fa-exclamation-circle"
+            uib-tooltip="{{$ctrl.percentageEstimated}}"
+            tooltip-placement="top"
+            class="link-store"
+            ng-if="$ctrl.estimatedPercentageGreaterThanTarget"
+            aria-hidden="true"></i>
+         Meta do mês / {{$ctrl.currentMonthName}}
+      </p>
+      <div class="mbg-h-c-tone-s-icon-dash"
+           ng-click="$ctrl.toggleShowValueStoreGoal(false)">
+         <i class="fa fa-lock lock-dash-store"
+            aria-hidden="true"
+            uib-tooltip="Sem permissão para visualizar"
+            tooltip-placement="left"
+            ng-if="!$ctrl.isPermissionStoreGoal"></i>
+         <i ng-if="$ctrl.hideValue && $ctrl.isPermissionStoreGoal"
+            disable-animate
+            class="far fa-eye eye-board-target"></i>
+         <i ng-if="!$ctrl.hideValue && $ctrl.isPermissionStoreGoal"
+            disable-animate
+            class="far fa-eye-slash eye-board-target"></i>
+
+      </div>
+   </div>
+   <div class="line-pay"></div>
+   <div class="goal-target">
+      <p ng-if="$ctrl.hideValue">Meta: <strong>{{$ctrl.goalStoreTarget }}</strong></p>
+      <p ng-if="!$ctrl.hideValue">Meta: <i class="fa fa-lock"
+            aria-hidden="true"
+            uib-tooltip="Sem permissão para visualizar"></i></p>
+   </div>
+   <div class="goal-day">
+      <p class="estimate-goal"
+         ng-if="!$ctrl.hideValue">Estimativa da meta: <i class="fa fa-lock"
+            aria-hidden="true"
+            uib-tooltip="Sem permissão para visualizar"></i>
+      </p>
+      <p class="estimate-goal-store"
+         ng-if="$ctrl.hideValue">Estimativa da meta: <strong>{{$ctrl.estimatedGoal }}</strong>
+
+         <i class="fa fa-exclamation-circle"
+            ng-if="$ctrl.hideValue"
+            tooltip-placement="right"
+            class="estimated"
+            uib-tooltip-html="$ctrl.messageTooltip"
+            aria-hidden="true"></i>
+      </p>
+   </div>
+
+   <div class="dashboard-wrapper">
+      <div class="chart-container"
+           id="container-speed"></div>
+   </div>
+</div>
+
+<div ng-show="!$ctrl.showDashboard"
+     class="hide-goal">
+   <label for="">Sem meta cadastrada. Defina sua meta hoje. <a class="state-goal"
+         ng-click="$ctrl.stateGoNewGoal()">Clique aqui</a> </label>
+</div>

package/src/components/mbg-store-goal/mbg-store-goal.scss

@@ -0,0 +1,156 @@
+.store-goal-wrapper{
+  .dashboard-wrapper {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+    width: 100%;
+  }
+  
+  .chart-container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 300px;
+    height: auto;
+    position: relative;
+    left: 2%;
+    bottom: 252px;
+  }
+  
+  .opacity-dash-goal{
+    opacity: 0.5;
+  }
+  
+  .goal-target{
+    position: relative;
+    top: 192px;
+    font-size: 14px;
+    color: #5f5b5b;
+  }
+  
+  
+
+  
+
+  
+  .estimate-goal{
+    font-size: 14px;
+      color: #5f5b5b;
+  }
+
+  .estimate-goal-store{
+    font-size: 14px;
+      color: #5f5b5b;
+      i{
+        color: #0EBCBD;
+      }
+     
+      .tooltip-inner {
+        background: transparent ;
+       }
+         
+  
+      .tooltip-chart-panel {
+        display: flex;
+        flex-direction: column;  
+        position: relative;
+        background:#0EBCBD !important;
+        font-weight: bold;
+        color: #FFFFFF;
+        width: 100%;
+        height: 100%;
+        margin-right: 200px;
+        border-radius: 10px;
+        opacity: 1.0;
+    }
+
+  }
+  
+
+  
+  
+
+  
+  .goal-day {
+    display: flex;
+    justify-content: space-between;
+    align-items: end;
+    position: relative;
+    top: 184px;
+    font-size: 16px;
+    color: #5f5b5b;
+  }
+  
+  
+  
+  .description-container-dash {
+    flex-grow: 1;
+    color: var(--titleColor);
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    margin-top: 16px;
+    font-weight: 600;
+    font-size: 14px; 
+  
+    .mbg-h-c-tone-s-icon-dash {
+      margin-top: -10px;
+      transition: opacity 500ms ease;
+      opacity: 0.9;
+    }
+  
+    .lock-dash-store{
+      position: relative;
+      right: -20px;
+      top: -10px;
+      // color: red;
+    }
+  }
+
+  @keyframes blink {
+    0% {
+      opacity: 1;
+    }
+    50% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+    }
+  }
+  
+  .description-dash {
+    font-size: 20px;
+    color: #5f5b5b;
+    position: relative;
+    left: -24px;
+
+    i{
+        animation: blink 1s infinite;
+        color: #ff8c00;
+        position: relative;
+        top: -12px;
+    }
+
+    .tooltip-inner {
+      background:#ff8c00 !important; 
+      color: #000000 !important;
+      width: 300px;
+    }
+  }
+  
+  }
+  .hide-goal{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    font-size: 14px;
+    color: #5f5b5b;
+  }
+  
+  .state-goal{
+    cursor: pointer;
+  }

package/src/components/mbg-store-goal/mbg-store-goal.ts

@@ -0,0 +1,259 @@
+import './mbg-store-goal.scss'
+import template from './mbg-store-goal.html'
+import * as Highcharts from 'highcharts'
+import * as HighchartsMore from 'highcharts/highcharts-more.js'
+import * as SolidGauge from 'highcharts/modules/solid-gauge.js'
+import * as Exporting from 'highcharts/modules/exporting.js'
+import * as ExportData from 'highcharts/modules/export-data.js'
+import * as Accessibility from 'highcharts/modules/accessibility.js'
+
+// Inicialize os módulos
+HighchartsMore(Highcharts)
+SolidGauge(Highcharts)
+Exporting(Highcharts)
+ExportData(Highcharts)
+Accessibility(Highcharts)
+
+class MbgStoreGoalController {
+  private status: string
+  private cappedPercentage
+  private percentageAchieved
+  private allowedToSee: boolean
+  private allowedCallBack: Function
+  private randomEmoji: string
+  private hideValue: boolean = false
+  private allowDashBoardAutoValues
+  private isPermissionStoreGoal
+  private estimatedGoal
+  private storeGoalDashboard
+  private currentMonthName
+  private percentageEstimatedStoreGoal
+  private estimatedPercentageGreaterThanTarget: boolean = false
+  private goalStoreTarget
+  private messageTooltip: string = ''
+  private percentageEstimated
+  private showDashboard: boolean = false
+
+  constructor(
+    public $scope,
+    public $element,
+    public $attrs,
+    public $timeout,
+    public $filter,
+    public $state,
+  ) {}
+
+  async $onInit() {
+    this.initialize()
+    this.randomEmoji = this.generateRandomEmoji()
+    this.$scope.$watch(
+      '$ctrl.storeGoalDashboard',
+      (data) => {
+        if (data) {
+          this.configSolidGauge()
+        }
+      },
+      true,
+    )
+
+    const currentDate = new Date()
+    const currentMonth = currentDate.toLocaleString('default', { month: 'short' })
+    this.currentMonthName = currentMonth.charAt(0).toUpperCase() + currentMonth.slice(1)
+    this.message()
+  }
+
+  message() {
+    this.messageTooltip = `
+    <div class="tooltip-chart-panel">
+        <label>Média Diária: (Valor V. / Dia A.) </label><br>
+        <label>Projeção final: (Média Diária * Dias passados do mês) </label><br>
+        <label>Estimativa: (Projeção final / Meta do mês) * 100</label>
+    </div>`
+  }
+
+  async configSolidGauge() {
+    const storeGoalPercentage = this.hideValue ? this.storeGoalDashboard : 0
+    const porcentageEstimated = Number(this.percentageEstimatedStoreGoal.projectionFinal)
+    this.showDashboard = this.storeGoalDashboard
+    const percentageTarget = this.percentageEstimatedStoreGoal.percentageTarget.toFixed(2)
+    const showPercentage = this.hideValue ? `${percentageTarget}%` : '****'
+    this.percentageEstimated = `Alerta: Você atingirá aproximadamente ${showPercentage} da sua meta se continuar no ritmo atual.`
+    const goal = this.percentageEstimatedStoreGoal.target
+
+    this.goalStoreTarget = this.$filter('currency')(isNaN(goal) ? 0 : goal, 'R$ ')
+    this.estimatedGoal = this.$filter('currency')(isNaN(goal) ? 0 : porcentageEstimated, 'R$ ')
+
+    if (porcentageEstimated < goal) {
+      this.estimatedPercentageGreaterThanTarget = true
+    } else {
+      this.estimatedPercentageGreaterThanTarget = false
+    }
+
+    const gaugeOptions = this.gaugeOptions()
+
+    const chartSpeed = Highcharts.chart(
+      'container-speed',
+      Highcharts.merge(gaugeOptions, {
+        yAxis: {
+          min: 0,
+          max: 100,
+        },
+
+        credits: {
+          enabled: false,
+        },
+
+        series: [
+          {
+            name: 'Speed',
+            data: [storeGoalPercentage],
+            dataLabels: {
+              format: this.hideValue
+                ? '<div style="display: flex;justify-content: center;align-items: center;margin-top: -20px;">' +
+                  '<span style="font-size:25px">{y}</span><br/>' +
+                  '<span style="font-size:12px;opacity:0.4">%</span>' +
+                  '</div>'
+                : '<div style="margin-top: -20px;">' +
+                  '<span style="font-size:25px"><i class="fa fa-lock"</i></span>' +
+                  '</div>',
+            },
+          },
+        ],
+      }),
+    )
+
+    this.updateChart(storeGoalPercentage, chartSpeed)
+  }
+  updateChart(totalPercentage, chartSpeed) {
+    const point = chartSpeed.series[0].points[0]
+    point.update(totalPercentage)
+  }
+
+  gaugeOptions() {
+    return {
+      chart: {
+        type: 'solidgauge',
+        backgroundColor: 'none',
+        // plotBorderWidth: 0,
+        // margin: [0, 0, 0, 0],
+      },
+
+      title: null,
+      pane: {
+        center: ['50%', '90%'],
+        size: '100%',
+        startAngle: -90,
+        endAngle: 90,
+        background: {
+          backgroundColor: 'none',
+          borderRadius: 5,
+          innerRadius: '60%',
+          outerRadius: '100%',
+          shape: 'arc',
+        },
+      },
+
+      exporting: {
+        enabled: false,
+      },
+
+      tooltip: {
+        enabled: false,
+      },
+
+      // the value axis
+      yAxis: {
+        stops: [
+          [0.1, '#DF5353'], // Vermelho para até 10% da meta
+          [0.5, '#DDDF0D'], // Amarelo entre 10% e 50%
+          [0.9, '#55BF3B'], // Verde para mais de 50%
+        ],
+        lineWidth: 0,
+        tickWidth: 0,
+        minorTickInterval: null,
+        tickAmount: 2,
+        title: {
+          y: -80,
+        },
+        labels: {
+          y: 16,
+        },
+      },
+
+      plotOptions: {
+        solidgauge: {
+          borderRadius: 3,
+          dataLabels: {
+            y: 5,
+            borderWidth: 0,
+            useHTML: true,
+            style: {
+              textAlign: 'center',
+              width: '120px',
+              whiteSpace: 'nowrap',
+            },
+          },
+        },
+      },
+    }
+  }
+
+  initialize() {
+    if (this.allowDashBoardAutoValues) {
+      this.hideValue = this.isPermissionStoreGoal ? true : false
+      return
+    }
+
+    if (this.allowedToSee && !this.allowDashBoardAutoValues) {
+      this.hideValue = this.allowDashBoardAutoValues && this.isPermissionStoreGoal ? true : false
+      return
+    }
+
+    this.hideValue = this.allowedToSee && this.isPermissionStoreGoal ? true : false
+  }
+
+  stateGoNewGoal() {
+    this.$state.go('app.goal.list')
+  }
+
+  generateRandomEmoji = () => {
+    const emojis = ['🔐🔐🔐']
+    return emojis[0]
+  }
+
+  toggleShowValueStoreGoal() {
+    if ((this.allowedToSee !== undefined && !this.allowedToSee) || !this.isPermissionStoreGoal) {
+      if (this.allowedCallBack) {
+        this.allowedCallBack()
+      }
+      return
+    }
+
+    this.hideValue = !this.hideValue
+    this.randomEmoji = this.generateRandomEmoji()
+    this.configSolidGauge()
+  }
+}
+MbgStoreGoalController['$inject'] = [
+  '$scope',
+  '$element',
+  '$attrs',
+  '$timeout',
+  '$filter',
+  '$state',
+]
+
+const mbgStoreGoal = {
+  bindings: {
+    allowedToSee: '=?',
+    allowedCallBack: '&?',
+    storeGoalDashboard: '=?',
+    percentageEstimatedStoreGoal: '=?',
+    isPermissionStoreGoal: '=?',
+    allowDashBoardAutoValues: '=?',
+  },
+  template,
+  controller: MbgStoreGoalController,
+}
+
+export { mbgStoreGoal }

package/src/index.html

@@ -159,12 +159,14 @@
   <!-- <div style="padding: 100px;">
     <div class="row">
       <div class="col-md-12">  -->
-  <!-- <div class=""
+  <div class=""
        style="height: 260px">
-    <mbg-text-editor ng-model="editorJodit"
+    <mbg-store-goal></mbg-store-goal>
+
+    <!-- <mbg-text-editor ng-model="editorJodit"
                      ng-if="testeeditorif"
-                     ng-change="changeEditorTeste(value)"></mbg-text-editor>
-  </div> -->
+                     ng-change="changeEditorTeste(value)"></mbg-text-editor> -->
+  </div>
   <!-- <mbg-address ng-model="address"></mbg-address>
         <pre>{{ address | json }}</pre>
       </div>