feat(chart): add chart implementation

src/components/Account.vue

@@ -2,7 +2,14 @@
   <div class="account-tab">
     <b-card no-body>
       <b-tabs card>
-        <b-tab :title=account.name >
+        <b-tab title="Vue Global">
+          <scatter-chart
+              v-if="loaded"
+              :chartdata="chartData"
+              />
+        </b-tab>
+
+        <b-tab title="Vue detaillé" >
           <div>
           <div class="expense-button-div float-left">
             <b-button variant="success">Ajouter une dépense</b-button>
@@ -22,7 +29,7 @@
         <!-- Styled -->
         <b-form-file
             v-model="file"
-            :state="Boolean(file1)"
+            :state="Boolean(file)"
             placeholder="Choose a file or drop it here..."
             drop-placeholder="Drop file here..."
         ></b-form-file>
@@ -42,8 +49,10 @@
 </template>
 
 <script>
-import {BCard, BTabs , BTab, BTable, BFormFile} from "bootstrap-vue";
-import {getAnAccount, getExpenses, sendCSVImportExpenses} from "@/config/noscomptes";
+import {BCard, BTabs , BTab, BTable, BFormFile, BModal, BButton} from "bootstrap-vue";
+import {getAnAccount, getExpenses, sendCSVImportExpenses} from "@/service/noscomptes";
+import {formatExpenses} from "@/service/expenses";
+import ScatterChart from './charts/BarChart.vue';
 export default {
   name: 'account',
   data: function () {
@@ -72,7 +81,9 @@ export default {
         expenseDate: "Today",
         libelle:"Test",
         value: 10
-      }]
+      }],
+      chartData:{} ,
+      loaded: false,
     }
   },
   beforeCreate() {
@@ -82,7 +93,10 @@ export default {
     })
     getExpenses(loggedUser.oauth_token, loggedUser.nosComptesId, this.$route.params.accountId).then(data => {
         this.expenses = data
+      this.chartData = formatExpenses(data)
+      this.loaded= true
     })
+
   },
   mounted () {
   },
@@ -99,16 +113,30 @@ export default {
     validateFormImportExpenses() {
       let loggedUser = this.$store.state.loggedUser
       sendCSVImportExpenses(loggedUser.oauth_token, loggedUser.nosComptesId, this.$route.params.accountId, this.file)
+          .then(()=>{
+            this.loaded = false
+            getExpenses(loggedUser.oauth_token, loggedUser.nosComptesId, this.$route.params.accountId).then(data => {
+              this.expenses = data
+              this.chartData = formatExpenses(data)
+              this.loaded = true
+            })
+
+            this.$refs['import-expense'].hide()
+          })
+
     }
 
 
   },
   components: {
+    ScatterChart,
     BCard,
     BTabs,
     BTab,
     BTable,
-    BFormFile
+    BFormFile,
+    BModal,
+    BButton
   }
 }
 </script>