feat: Data Import first cut

src/pages/DataImport/index.vue

@@ -0,0 +1,69 @@
+<template>
+  <div>
+    <div class="p-4">
+        <h4 class="pb-2">{{ _('Data Import') }}</h4>
+        <frappe-control
+          :docfield="{
+            fieldtype: 'Select',
+            fieldname: 'referenceDoctype',
+            options: ['Select a doctype...', 'ToDo', 'Item', 'Party', 'Invoice']
+          }"
+          @change="doctype => showTable(doctype)"
+        />
+        <f-button primary @click="importData">Submit</f-button>
+        <div class="pt-2" ref="datatable" v-once></div>
+    </div>
+  </div>
+</template>
+<script>
+import frappe from 'frappejs';
+import DataTable from 'frappe-datatable';
+import { convertFieldsToDatatableColumns } from 'frappejs/client/ui/utils';
+
+export default {
+  methods: {
+    showTable(doctype) {
+      this.doctype = doctype;
+      const meta = frappe.getMeta(doctype);
+      const columns = convertFieldsToDatatableColumns(meta.fields);
+      this.renderTable(columns);
+    },
+    renderTable(columns) {
+      this.datatable = new DataTable(this.$refs.datatable, {
+        columns,
+        data: [
+          [],
+          [],
+          [],
+          [],
+          [],
+          [],
+          [],
+          [],
+        ],
+        pasteFromClipboard: true
+      });
+    },
+    importData() {
+      const rows = this.datatable.datamanager.getRows();
+
+      const data = rows.map(row => {
+        return row.slice(1).reduce((prev, curr) => {
+          prev[curr.column.field.fieldname] = curr.content;
+          return prev;
+        }, {})
+      });
+
+      data.forEach(async d => {
+        try {
+          await frappe.newDoc(Object.assign(d, {
+            doctype: this.doctype,
+          })).insert()
+        } catch(e) {
+          console.log(e);
+        }
+      })
+    }
+  }
+}
+</script>

src/router/index.js

@@ -5,6 +5,8 @@ import coreRoutes from 'frappejs/ui/routes';
 import Report from 'frappejs/ui/pages/Report';
 import reportViewConfig from '../../reports/view';
 
+import DataImport from '../pages/DataImport';
+
 Vue.use(Router);
 
 const routes = [].concat(coreRoutes, [
@@ -20,6 +22,11 @@ const routes = [].concat(coreRoutes, [
         filters: route.query
       };
     }
+  },
+  {
+    path: '/data-import',
+    name: 'Data Import',
+    component: DataImport
   }
 ]);
 

src/sidebarConfig.js

@@ -51,6 +51,14 @@ export default {
           label: _('Sales Register'), route: '#/report/sales-register'
         }
       ]
+    },
+    {
+      title: _('Tools'),
+      items: [
+        {
+          label: _('Data Import'), route: '#/data-import'
+        }
+      ]
     }
   ]
 };