Merge branch 'move-to-vue' of https://github.com/frappe/accounting into move-to-vue

.postcssrc.js

@@ -2,7 +2,15 @@
 
 module.exports = {
   "plugins": {
-    "postcss-import": {},
+    "postcss-import": {
+      resolve(id) {
+        // sass imports that start with ~ (which refers node_modules) should be supported
+        if (id.startsWith('~')) {
+          return id.slice(1);
+        }
+        return id;
+      }
+    },
     "postcss-url": {},
     // to edit target browsers: use "browserslist" field in package.json
     "autoprefixer": {}

electron/settings.js

@@ -6,21 +6,21 @@ const homedir = os.homedir();
 const configFilePath = path.join(homedir, '.config', 'frappe-accounting', 'settings.json');
 
 function getSettings() {
-    let settings;
+  let settings;
-    try {
+  try {
-        settings = require(configFilePath);
+    settings = require(configFilePath);
-    } catch (e) {
+  } catch (e) {
-        settings = {}
+    settings = {};
-    }
+  }
 
-    return settings;
+  return settings;
 }
 
 async function saveSettings(settings) {
-    await writeFile(configFilePath, JSON.stringify(settings));
+  await writeFile(configFilePath, JSON.stringify(settings));
 }
 
 module.exports = {
-    getSettings,
+  getSettings,
-    saveSettings
+  saveSettings
-}
+};

src/main.js

@@ -5,25 +5,15 @@
 import Vue from 'vue';
 import App from './App';
 import router from './router';
+import frappeVue from 'frappejs/ui/plugins/frappeVue';
 
 // frappejs imports
-import io from 'socket.io-client';
 import frappe from 'frappejs';
+import io from 'socket.io-client';
 import HTTPClient from 'frappejs/backends/http';
-import Observable from 'frappejs/utils/observable';
 import common from 'frappejs/common';
 import coreModels from 'frappejs/models';
 import models from '../models';
-import { _ } from 'frappejs/utils';
-
-// vue components
-import NotFound from 'frappejs/ui/components/NotFound';
-import FeatherIcon from 'frappejs/ui/components/FeatherIcon';
-import FrappeControl from 'frappejs/ui/components/controls/FrappeControl';
-import Button from 'frappejs/ui/components/Button';
-import Indicator from 'frappejs/ui/components/Indicator';
-import modalPlugin from 'frappejs/ui/components/Modal/plugin';
-import formModalPlugin from 'frappejs/ui/plugins/formModal';
 import registerReportMethods from '../reports';
 
 frappe.init();
@@ -35,8 +25,6 @@ frappe.fetch = window.fetch.bind();
 frappe.db = new HTTPClient({ server });
 const socket = io.connect(`http://${server}`);
 frappe.db.bindSocketClient(socket);
-frappe.registerModels(models);
-frappe.docs = new Observable();
 frappe.getSingle('SystemSettings');
 registerReportMethods();
 
@@ -54,29 +42,7 @@ frappe.getSingle('AccountingSettings')
 window.frappe = frappe;
 
 Vue.config.productionTip = false;
-
+Vue.use(frappeVue);
-Vue.component('not-found', NotFound);
-Vue.component('feather-icon', FeatherIcon);
-Vue.component('frappe-control', FrappeControl);
-Vue.component('f-button', Button);
-Vue.component('indicator', Indicator);
-
-Vue.use(modalPlugin);
-Vue.use(formModalPlugin);
-
-Vue.mixin({
-  computed: {
-    frappe() {
-      return frappe;
-    }
-  },
-  methods: {
-    // global translation function in every component
-    _(...args) {
-      return _(...args);
-    }
-  }
-});
 
 /* eslint-disable no-new */
 new Vue({

src/pages/SetupWizard/index.vue

@@ -1,36 +1,36 @@
 <template>
-    <div class="setup-wizard d-flex justify-content-center">
+  <div class="setup-wizard d-flex justify-content-center">
-        <div class="col-4 border rounded shadow-sm p-4 mt-5">
+    <div class="col-4 border rounded shadow-sm p-4 mt-5">
-            <h4 class="text-center">Setup your account</h4>
+      <h4 class="text-center">Setup your account</h4>
-            <div class="progress-indicator d-flex justify-content-center p-4">
+      <div class="progress-indicator d-flex justify-content-center p-4">
-                <indicator class="mr-1" :color="indicatorColor(index)" v-for="(section, index) in layout.sections" :key="index" />
+        <indicator class="mr-1" :color="indicatorColor(index)" v-for="(section, index) in layout.sections" :key="index" />
-            </div>
+      </div>
-            <form-layout
+      <form-layout
-                :doc="doc"
+        :doc="doc"
-                :fields="fields"
+        :fields="fields"
-                :layout="layout"
+        :layout="layout"
-                :currentSection="currentSection"
+        :currentSection="currentSection"
-            />
+      />
-            <div class="d-flex justify-content-between">
+      <div class="d-flex justify-content-between">
-                <div>
+        <div>
-                    <f-button secondary v-if="currentSection > 0"
+          <f-button secondary v-if="currentSection > 0"
-                        @click="prevSection">
+            @click="prevSection">
-                        Prev
+            Prev
-                    </f-button>
+          </f-button>
-                </div>
-                <div>
-                    <f-button primary v-if="currentSection < layout.sections.length - 1"
-                        @click="nextSection">
-                        Next
-                    </f-button>
-                    <f-button primary v-if="currentSection === layout.sections.length - 1"
-                        @click="submit">
-                        Complete
-                    </f-button>
-                </div>
-            </div>
         </div>
+        <div>
+          <f-button primary v-if="currentSection < layout.sections.length - 1"
+            @click="nextSection">
+            Next
+          </f-button>
+          <f-button primary v-if="currentSection === layout.sections.length - 1"
+            @click="submit">
+            Complete
+          </f-button>
+        </div>
+      </div>
     </div>
+  </div>
 </template>
 <script>
 import frappe from 'frappejs';
@@ -40,61 +40,64 @@ import indicatorColor from 'frappejs/ui/constants/indicators';
 import setupConfig from './config';
 
 export default {
-    data() {
+  name: 'SetupWizard',
-        return {
+  data() {
-            currentSection: 0
+    return {
-        }
+      currentSection: 0
-    },
+    };
-    components: {
+  },
-        FormLayout
+  components: {
-    },
+    FormLayout
-    created() {
+  },
-        this.doc = new Observable();
+  created() {
-    },
+    this.doc = new Observable();
-    methods: {
+  },
-        async submit() {
+  methods: {
-            const {
+    async submit() {
-                companyName,
+      const {
-                country,
+        companyName,
-                name,
+        country,
-                email,
+        name,
-                abbreviation,
+        email,
-                bankName,
+        abbreviation,
-                fiscalYearStart,
+        bankName,
-                fiscalYearEnd
+        fiscalYearStart,
-            } = this.doc;
+        fiscalYearEnd
+      } = this.doc;
 
-            const doc = await frappe.getSingle('AccountingSettings');
+      const doc = await frappe.getSingle('AccountingSettings');
-            await doc.set({
+      await doc.set({
-                companyName,
+        companyName,
-                country,
+        country,
-                fullname: name,
+        fullname: name,
-                email,
+        email,
-                bankName,
+        bankName,
-                fiscalYearStart,
+        fiscalYearStart,
-                fiscalYearEnd
+        fiscalYearEnd
-            });
+      });
-            await doc.update();
+      await doc.update();
 
-            this.$router.push('/list/ToDo');
+      this.$router.push('/list/ToDo');
-        },
-        nextSection() {
-            this.currentSection += 1;
-        },
-        prevSection() {
-            this.currentSection -= 1;
-        },
-        indicatorColor(i) {
-            return i === this.currentSection ? indicatorColor.BLUE : '';
-        }
     },
-    computed: {
+    nextSection() {
-        fields() {
+      this.currentSection += 1;
-            return setupConfig.fields;
+    },
-        },
+    prevSection() {
-        layout() {
+      this.currentSection -= 1;
-            return setupConfig.layout;
+    },
-        }
+    indicatorColor(i) {
+      return i === this.currentSection
+        ? indicatorColor.BLUE
+        : indicatorColor.GREY;
     }
-}
+  },
+  computed: {
+    fields() {
+      return setupConfig.fields;
+    },
+    layout() {
+      return setupConfig.layout;
+    }
+  }
+};
 </script>