feat: init

form42 · Jun 5, 2020 · 98b5e8e · 98b5e8e
1 parent 4261a81
commit 98b5e8e
Show file tree

Hide file tree

Showing 19 changed files with 1,684 additions and 0 deletions.
diff --git a/babel.config.js b/babel.config.js
@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
+}
diff --git a/package.json b/package.json
@@ -0,0 +1,34 @@
+{
+  "name": "ledger",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build",
+    "test:unit": "vue-cli-service test:unit"
+  },
+  "dependencies": {
+    "core-js": "^3.6.4",
+    "dinero.js": "^1.8.1",
+    "papaparse": "^5.2.0",
+    "vue": "^2.6.11",
+    "vuetify": "^2.2.27",
+    "vuex": "^3.1.3"
+  },
+  "devDependencies": {
+    "@vue/cli-plugin-babel": "^4.3.0",
+    "@vue/cli-plugin-unit-jest": "^4.3.0",
+    "@vue/cli-service": "^4.3.0",
+    "node-sass": "^4.14.1",
+    "sass": "^1.19.0",
+    "sass-loader": "^8.0.2",
+    "vue-cli-plugin-vuetify": "^2.0.5",
+    "vue-template-compiler": "^2.6.11",
+    "vuetify-loader": "^1.3.0"
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not dead"
+  ]
+}
diff --git a/public/example/bill.csv b/public/example/bill.csv
@@ -0,0 +1,48 @@
+type,time,category,amount
+0,1561910400000,8quhsdjkq0,5400
+0,1561910400000,0f1u2i3sadds,1500
+0,1563897600000,328jka9aslss,3900.02
+0,1564502400000,b8129020zsk,1900
+0,1564588800000,8quhsdjkq0,5400
+0,1564588800000,0f1u2i3sadds,1500
+0,1564588800000,328jka9aslss,5000
+0,1566316800000,b8129020zsk,2000
+0,1567267200000,8quhsdjkq0,5400
+0,1567267200000,0f1u2i3sadds,1500
+0,1569772800000,1b1231yubad,3000
+0,1569772800000,b8129020zsk,1500
+0,1569772800000,328jka9aslss,5000
+0,1569859200000,0f1u2i3sadds,1500
+0,1572364800000,o72910xjsks,3000
+0,1572451200000,328jka9aslss,4600
+0,1572451200000,328jka9aslss,3800
+0,1572537600000,0f1u2i3sadds,1500.03
+0,1574179200000,o72910xjsks,2000
+0,1574870400000,1b1231yubad,3000
+0,1574956800000,8quhsdjkq0,5400
+0,1575043200000,328jka9aslss,5000
+0,1575129600000,0f1u2i3sadds,1500
+0,1577289600000,328jka9aslss,4000
+0,1577345333184,o72910xjsks,2000
+0,1577345367638,1b1231yubad,3000
+0,1577345378418,jd87ialaljsjks,800
+0,1577345504140,b8129020zsk,1000
+0,1577345517217,27wquwjnsa,2000
+0,1577345576917,8quhsdjkq0,5400
+0,1577345590283,1b1231yubad,3000
+0,1577345789527,328jka9aslss,3900
+0,1577548800000,8quhsdjkq0,5400
+1,1561910400000,ssdid09skd,30000
+1,1564502400000,512kslajjskk,1000
+1,1567094400000,1128jsllqqah,-3000
+1,1567180800000,ssdid09skd,28000
+1,1569772800000,ssdid09skd,28000
+1,1569772800000,1128jsllqqah,2000
+1,1572451200000,ssdid09skd,20000
+1,1577345267529,ssdid09skd,30000
+1,1577345303191,1128jsllqqah,-10000
+1,1577345317187,512kslajjskk,1000
+1,1577345463930,ssdid09skd,3000.02
+1,1577345477581,512kslajjskk,2000.01
+1,1577345638784,1128jsllqqah,2000.01
+1,1577345638784,,2000.00
diff --git a/public/example/categories.csv b/public/example/categories.csv
@@ -0,0 +1,12 @@
+id,type,name
+1b1231yubad,0,Car Loan
+27wquwjnsa,0,Maintenance
+8quhsdjkq0,0,Home Loan
+0f1u2i3sadds,0,House Rent
+o72910xjsks,0,Household
+b8129020zsk,0,Trasportation
+jd87ialaljsjks,0,Travel
+328jka9aslss,0,Food
+ssdid09skd,1,Wage
+1128jsllqqah,1,Stock
+512kslajjskk,1,Fund
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <title><%= htmlWebpackPlugin.options.title %></title>
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>
diff --git a/src/App.vue b/src/App.vue
@@ -0,0 +1,122 @@
+<template>
+  <v-app id="ledger">
+    <v-app-bar app clipped-left color="amber">
+      <!-- <v-app-bar-nav-icon @click="drawer = !drawer"></v-app-bar-nav-icon> -->
+      <span class="title ml-3 mr-5">
+        <span class="font-weight-light">Mini Ledger</span>
+      </span>
+      <v-spacer></v-spacer>
+      <v-tooltip bottom>
+        <template v-slot:activator="{ on }">
+          <a v-on="on" href=".\\example\\bill.csv" rel="nofollow noreferrer" download>bill.csv</a>
+          <span class="title ml-2 mr-2"></span>
+          <a
+            v-on="on"
+            href=".\\example\\categories.csv"
+            rel="nofollow noreferrer"
+            download
+          >catagories.csv</a>
+        </template>
+        <span>example files</span>
+      </v-tooltip>
+      <v-tooltip bottom>
+        <template v-slot:activator="{ on }">
+          <v-btn icon v-on="on" @click="uploadSheet = true">
+            <v-icon>mdi-upload</v-icon>
+          </v-btn>
+        </template>
+        <span>Upload Csv</span>
+      </v-tooltip>
+    </v-app-bar>
+    <Notification/>
+    <v-content>
+      <v-container fluid class="grey lighten-4" grid-list-xl fill-height>
+        <WorkTable/>
+      </v-container>
+      <v-bottom-sheet v-model="uploadSheet" inset>
+        <v-sheet class="text-center" height="230px">
+          <CsvUpload/>
+        </v-sheet>
+      </v-bottom-sheet>
+    </v-content>
+  </v-app>
+</template>
+
+
+<script>
+import CsvUpload from "@/components/CsvUpload";
+import WorkTable from "@/components/WorkTable";
+import Notification from "@/components/Notification";
+import { mapActions } from "vuex";
+
+export default {
+  props: {
+    source: String
+  },
+  components: {
+    CsvUpload,
+    WorkTable,
+    Notification
+  },
+  data() {
+    return {
+      uploadSheet: false
+    };
+  },
+
+  mounted() {
+    // show case
+    const billData = [
+      {
+        type: "0",
+        time: "1561910400000",
+        category: "27wquwjnsa",
+        amount: "-10000"
+      },
+      {
+        type: "0",
+        time: "1561910400000",
+        category: "27wquwjnsa",
+        amount: "-900.01"
+      },
+      {
+        type: "0",
+        time: "1561910400000",
+        category: "328jka9aslss",
+        amount: "100.01"
+      },
+      { type: "1", time: "1577345638784", category: "", amount: "2000.012" }
+    ];
+
+    const categoryData = [
+      { id: "27wquwjnsa", type: "0", name: "Maintenance" },
+      { id: "328jka9aslss", type: "0", name: "Food" }
+    ];
+
+    this.addDataToLedger({
+      csvBill: billData,
+      csvCategory: categoryData
+    });
+  },
+
+  methods: {
+    ...mapActions({
+      addDataToLedger: "addDataToLedger"
+    })
+  }
+};
+</script>
+
+<style>
+#app {
+  font-family: "Avenir", Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  margin-top: 60px;
+}
+.v-snack--bottom {
+  bottom: 88px;
+}
+</style>
+
diff --git a/src/assets/logo.png b/src/assets/logo.png
diff --git a/src/assets/logo.svg b/src/assets/logo.svg
diff --git a/src/components/Confirm.vue b/src/components/Confirm.vue
@@ -0,0 +1,47 @@
+<template>
+  <v-dialog v-model="isShow" max-width="500px" :retain-focus="false">
+    <v-card>
+      <v-card-title v-if="!!title">
+        <span class="headline">{{title}}</span>
+      </v-card-title>
+      <v-card-text class="pa-8">{{ message }}</v-card-text>
+      <v-card-actions>
+        <v-spacer></v-spacer>
+        <v-btn color="amber" text @click="cancel">Cancel</v-btn>
+        <v-btn color="amber" text @click="confirm">Confirm</v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-dialog>
+</template>
+
+<script>
+export default {
+  name: "Confirm",
+  data: () => ({
+    isShow: false,
+    resolve: null,
+    reject: null,
+    message: null,
+    title: null
+  }),
+  methods: {
+    openDialog({ message = "Do you confirm?", title = null }) {
+      this.isShow = true;
+      this.title = title;
+      this.message = message;
+      return new Promise((resolve, reject) => {
+        this.resolve = resolve;
+        this.reject = reject;
+      });
+    },
+    confirm() {
+      this.resolve(true);
+      this.isShow = false;
+    },
+    cancel() {
+      this.resolve(false);
+      this.isShow = false;
+    }
+  }
+};
+</script>